CSS漸變效果是指在網頁中產生從一種顏色漸變到其它顏色的效果。在web設計中，這種漸變效果是一種常見的元素，它可以用來增加網頁的美觀程度。下面讓我們看看如何實現CSS漸變效果。

/* 線性漸變 */
.linear-gradient {
background: linear-gradient(to right, #feac5e, #c779d0, #4bc0c8);
}

實現線性漸變需要使用background屬性和linear-gradient函數，其中to right表示從左至右的漸變方向，#feac5e、#c779d0和#4bc0c8則是漸變的顏色值，它們按照從左至右的順序呈現。

/* 徑向漸變 */
.radial-gradient {
background: radial-gradient(circle, #f3e5f5, #131344);
}

實現徑向漸變需要使用background屬性和radial-gradient函數，其中circle表示以橢圓形為漸變方向，#f3e5f5和#131344則是漸變的顏色值，由里向外呈現。

/* 線性漸變 + 重復 */
.repeat-linear-gradient {
background: repeating-linear-gradient(to right, #feac5e, #c779d0, #4bc0c8);
}

如果想實現重復的線性漸變，則可以使用repeating-linear-gradient函數，并在漸變方向后面添加一個逗號，將漸變所需顏色值作為參數傳入即可。

/* 徑向漸變 + 背景圖 */
.background-image {
background: url('../images/bg.jpg'), radial-gradient(circle, #f3e5f5, #131344);
}

有時候想實現漸變效果同時又想加入背景圖片，可以將背景圖和漸變函數一起使用。需要注意的是，背景圖片的路徑需正確。