<span class="ts-icon is-user-icon"></span>
<span class="ts-icon is-video-icon"></span>
<span class="ts-icon is-camera-icon"></span>
Tocas UI 的圖示來自 Font Awesome 6.x,其名稱可以直接沿用至元件中(用法為:is-名稱-icon
)。
在 Font Awesome 裡某些圖示會有另一個版本,這個版本偏向非實心的。
<span class="ts-icon is-regular is-heart-icon"></span>
<span class="ts-icon is-heart-icon"></span>
<span class="ts-icon is-regular is-user-icon"></span>
<span class="ts-icon is-user-icon"></span>
使一個圖示不停地旋轉。
<span class="ts-icon is-spinning is-circle-notch-icon"></span>
<span class="ts-icon is-spinning is-spinner-icon"></span>
更改圖示的大小。
<span class="ts-icon is-small is-house-icon"></span>
<span class="ts-icon is-house-icon"></span>
<span class="ts-icon is-large is-house-icon"></span>
<span class="ts-icon is-big is-house-icon"></span>
<span class="ts-icon is-huge is-house-icon"></span>
圖示可以是圓形外框描繪的。
<span class="ts-icon is-circular is-house-icon"></span>
<span class="ts-icon is-circular is-twitter-icon"></span>
<span class="ts-icon is-circular is-facebook-icon"></span>
圖示可以由一個圓角外框描繪。
<span class="ts-icon is-rounded is-users-icon"></span>
<span class="ts-icon is-rounded is-heart-icon"></span>
<span class="ts-icon is-rounded is-star-icon"></span>
在前或後新增間隔以避免與其他元件相鄰太近。
準備起飛 <span class="ts-icon is-start-spaced is-plane-departure-icon"></span>
<span class="ts-icon is-end-spaced is-car-icon"></span> Tesla
透過搜尋 <span class="ts-icon is-spaced is-magnifying-glass-icon"></span> 功能可以找到你要的事物。