CSS是網頁設計中非常常用的一種語言，它能夠為頁面添加各種各樣的效果。其中，疊加圖標顏色是更為常見的一種效果。通過一些簡單的CSS代碼，我們可以將一個圖標的顏色修改為我們所需要的顏色。 首先，我們需要將圖標的顏色設置為透明色。這樣，我們才可以在其上疊加其他的顏色。我們可以使用以下CSS代碼來實現：

.icon {
color: transparent;
}

接著，我們需要在圖標的上方添加一個背景顏色。這個背景顏色將會疊加在圖標顏色之上，從而產生新的顏色。我們可以使用以下CSS代碼來添加背景顏色：

.icon-background {
background-color: #ff0000; /* 這里的#ff0000代表紅色 */
}

最后，我們可以使用CSS偽類選擇器：after，為圖標添加一層新的顏色。我們可以使用以下CSS代碼來添加圖標顏色：

.icon:after {
color: #ffffff; /* 這里的#ffffff代表白色 */
content: "\f046"; /* 這里的"\f046"代表FontAwesome字體庫中的一個圖標 */
}

這個代碼中的“\f046”代表了FontAwesome字體庫中的一個圖標。我們可以將其更改為我們所需要的圖標的代碼。 通過以上的CSS代碼，我們可以在圖標上疊加一個新的顏色，并且控制圖標的大小和位置。這種技術廣泛應用于網站設計中，為頁面添加各種各樣的效果。