在網頁設計中，我們經常會使用各種圖標來美化頁面，為了增加趣味性和互動性，我們可以使用CSS來為圖標添加旋轉動畫效果。

.icon{
font-size: 30px;
transition: transform 0.5s ease-in-out;
}
.icon:hover{
transform: rotate(360deg);
}

以上代碼中，我們首先給圖標添加了一個基礎樣式，其中font-size屬性控制了圖標的大小，transition屬性設置了圖標的變換過程，包括過渡時間、變換效果等。

接著我們設置了鼠標懸浮時的樣式，給圖標添加了一個旋轉動畫，使用了transform屬性來實現旋轉效果，其中rotate()函數控制了旋轉的角度。

通過使用CSS圖標旋轉動畫，我們可以為網頁注入更多的生命力和活力，提升用戶體驗和頁面質量。