在CSS中，我們可以使用偽類來改變字體圖標在點擊時的顏色，以下是一個基本的示例，展示了如何實現(xiàn)這一功能：

我們需要一個字體圖標，為了簡單起見，我將使用Font Awesome的圖標，假設(shè)我們有一個圖標類名為fa-icon。

HTML結(jié)構(gòu)可能如下：

<i class="fa-icon">Some Text</i>

我們可以使用CSS的偽類來改變圖標在點擊時的顏色，我們可以使用:active偽類來定義圖標在被點擊時的樣式，以下是一個基本的示例：

.fa-icon {
  color: #000; /* 初始顏色 */
}
.fa-icon:active {
  color: #f00; /* 被點擊時的顏色 */
}

在這個示例中，.fa-icon類定義了圖標的初始顏色，而.fa-icon:active類則定義了圖標在被點擊時的顏色，這樣，當圖標被點擊時，它的顏色就會從初始顏色變?yōu)楸稽c擊時的顏色。

這只是一個基本的示例，你可以根據(jù)自己的需求來調(diào)整顏色和其他樣式，你可能想要添加一些動畫效果來使顏色變化更加平滑，或者添加一些交互反饋來讓用戶知道他們已經(jīng)點擊了圖標，基本的原理應(yīng)該是相同的：使用CSS偽類來改變圖標在特定狀態(tài)下的樣式。