CSS圖標是一種用于網頁設計中的小圖標，可以通過CSS樣式進行調整和使用。在如今的網頁設計中，圖標的使用變得越來越重要，因為它可以增強頁面的可讀性和美觀性。

使用CSS圖標的好處是可以減少網站的頁面加載時間。相比于其他圖片格式，CSS圖標可以使用字體文件進行渲染，因此加載速度更快，而且可以隨時更改顏色、大小和樣式。

// CSS樣式代碼
.icon {
font-family: "FontAwesome";
font-size: 24px;
color: #333;
}

在使用CSS圖標之前，需要先引入字體文件。目前比較流行的CSS圖標庫有Font Awesome和Iconfont。這兩個庫之間的差異在于它們的圖標庫大小和文件格式。

例如，要使用Font Awesome庫中的圖標，可以先將它的CSS和字體文件引入到網頁中：

// 引入Font Awesome CSS和字體文件

一旦引入了樣式表，就可以在HTML標記中使用圖標了。例如，要顯示一個 Font Awesome 中的“微笑”圖標，只需要在HTML中添加一個帶有類名“icon”的元素：

// 在HTML中使用Font Awesome圖標

在Web設計中，CSS圖標具有各種用途。他們可以表示不同的產品或服務，提高主要內容的可讀性，或者用于添加一個漂亮的設計元素。盡管他們看起來很小，但是CSS圖標是現代Web設計中不可或缺的一部分。