CSS圖標有藍色框是一種常見的設計風格，它可以突出顯示圖標，并使其更加清晰明了。通常情況下，我們會使用CSS的border屬性來實現這一效果。

.icon {
width: 20px;
height: 20px;
display: inline-block;
border: 2px solid blue;
border-radius: 50%;
text-align: center;
font-size: 14px;
line-height: 20px;
}★

在上面的代碼中，我們創建了一個名為“icon”的類，使用CSS的border屬性給該圖標添加了一個2像素的藍色邊框。為了讓圖標看起來更圓潤，我們還使用了CSS的border-radius屬性，并將其設置為50%。此外，我們還將該圖標的文本居中，并設置了字體大小和行高。

為了將這個類應用到HTML文檔中的圖標上，我們使用了一個i標簽，并給它加上了“icon”類。

總之，使用CSS的border屬性可以為圖標添加藍色邊框，使其更加突出和易于辨認。同時，使用border-radius屬性可以讓圖標看起來更加圓潤。以上代碼可供參考，希望對你有所幫助。