Ionicons – 1200+ 免費精美圖標 Icons 開源下載,專為 Web、iOS、Android、桌面應用程式所開發

Ionicons 是一個專門提供免費 Web、iOS、Android 與桌面應用程式在開發時,所會需要使用到的各種 Icons 圖標,Ionicons 是由 Ionic Framework 團隊所開發與開源的,其授權是採用 MIT Licence,因此在使用的權利上非常的彈性。

Ionicons 是一個專門提供免費 Web、iOS、Android 與桌面應用程式在開發時,所會需要使用到的各種免費圖標,Ionicons 是由 Ionic Framework 團隊所開發與開源的,其授權是採用 MIT Licence,因此在使用的權利上非常的彈性。

如果你在尋找免費圖標的相關資源,我之前在網站當中也分享過其他免費圖標網站,你可以參考:

接著,就讓我們來看一下要如何在 Ionicons 下載與使用免費圖標吧!

網站名稱:Ionicons: The premium icon pack for Ionic Framework
網站網址:https://ionicons.com/

Ionicons 簡介教學

教你如何在 Ionicons 當中下載與使用免費圖標 Icons。

所需時間 2 minutes

透過搜尋框尋找 Icons

Ionicons - 透過搜尋框尋找圖標 Icons 或是往下挑選Pin

在 Ionicons 的首頁中,你可以直接透過搜尋框尋找圖標 Icons,或是直接往下拉,瀏覽所有的 Icons 圖標。其中,Ionicons 為每個圖標 Icons 都提供了三種樣式,分別是:Outline(輪廓)、Filled(填滿)與 Sharp(銳利)。你可以根據喜好,隨時切換查看不同的圖標樣式。

選擇與使用圖標 Icons

Ionicons - 點選圖標後,選擇使用 CSS 樣式格式或是下載 SVG 原始檔Pin

挑選你想要的圖標 Icons 之後,畫面下方會跳出顯示該圖標的 CSS 樣式格式,以及可以直接下載該圖標的 SVG 原始檔案,你可以根據你的使用需求,直接在網頁上顯示該圖標,或是下載 SVG 檔案後再進行製作。

下載全部圖標 Icons

Ionicons - 下載所有圖標 SVG 格式檔案Pin

除了一個一個尋找圖標使用之外,Icons 也提供一鍵下載所有 SVG 圖標的功能,在網頁右上方點選「Designer pack」即可下載所有的圖標 SVG 檔案。

Ionicons web component code 用法

在 Ionicons 當中,你會看到每個圖標除了下載 SVG 格式檔案之外,都會提供一個「WEB COMPONENT CODE」的 CLASS 樣式,如果你直接複製貼上到網站程式碼當中,是無法起作用的,在使用之前,你需要先在網頁的 Header 處,插入 Ionicons 的 CSS 樣式表來源:

只要在 Header 或 Footer 當中上述的 CSS 樣式表來源,就可以在網頁當中輸入 web component code,並顯示相對應的圖標 Icons 了。

以上就是「Ionicons – 1200+ 免費精美圖標 Icons 開源下載,專為 Web、iOS、Android、桌面應用程式所開發」的完整內容,如果你喜歡的話,請幫忙點讚並分享出去,讓更多人看到。

Sliven 褚崇名
Sliven 褚崇名

每日分享科技新知、免費資源以及 WordPress、虛擬主機相關主題,任何問題歡迎在科技月球下方留言,或是發送 Email 至 [email protected] 與我聯繫。

文章: 669

發佈留言

發佈留言必須填寫的電子郵件地址不會公開。 必填欄位標示為 *


目錄
Share to...