IconPark – 字節跳動官方出品超過 1287+ 高品質圖標免費下載,可線上客製化圖示外觀樣式

IconPark 網站是由字節跳動官方所推出的線上開源圖標庫,截至目前已提供了 1287+ 個高品質的圖標,所有圖標都是採用 Apache License 2.0 授權方式,因此你可以任意將其使用在商業用途或個人用途的專案當中,無需署名或是附上來源連結。

IconPark 網站是由字節跳動官方所推出的線上開源圖標庫,截至目前已提供了 1287+ 個高品質的圖標,所有圖標都是採用 Apache License 2.0 授權方式,因此你可以任意將其使用在商業用途或個人用途的專案當中,無需署名或是附上來源連結。

IconPark 與其他利用 SVG 格式來改變外觀效果的資源不同之處在於,它利用了一種創新的技術,透過改變一個 SVG 檔案的屬性就可以變換出多種的主題。同時,它還支援多種跨平台的程式碼,讓你可以直接複製 SVG 程式碼、Reat 圖標代碼、Vue 圖標代碼…等等,讓你能夠直接使用在各種不同的編輯工具當中進行編輯。

此外,你也能在網站介面當中直接調整圖標的大小、外框粗細、圖標風格、圖標顏色、端點類型、拐點類型…等等客製化樣式設定,並在最後直接導出成 SVG 或 PNG 圖片檔案格式。

IconPark 網站介面的左側提供了各種圖標分類的設置,讓你可以根據不同的類別需求,快速的找到相對應的圖標。或者,也可以透過上方的搜尋框進行整站的圖標搜尋。

網站名稱:ByDesign IconPark
網站網址:https://iconpark.bytedance.com/official

IconPark 簡介教學

Step 1

進入頁面後,首先可以在左側快速篩選圖標的類別,或者也能夠直接從上方搜尋框進行圖標的尋找:

選取圖標類別與搜尋圖標Pin
選取圖標類別與搜尋圖標

比較可惜的地方是,搜尋框不支援簡/繁轉換,因此若非輸入相對的簡體字,是無法正確的顯示結果。

Step 2

IconPark 有個很棒的功能是支援批量選取與下載。在畫面中你可以批次點選想要下載的圖標,接著點選右上方的「批量下載 SVG」將所選取的所有圖標一次打包下載:

一次選取所有想要的圖標後批次進行 SVG 下載Pin
一次選取所有想要的圖標後批次進行 SVG 下載
Step 3

在每個圖標右側有三個點的圖示,滑鼠移入後就會出現下拉選單,可以讓你複製 SVG、React、Vue 的程式代碼,並可單獨的下載單一圖標的 SVG 與 PNG 圖片格式檔案:

單一圖標可複製 SVG, React, Vue 程式碼與下載 SVG, PNG 檔案Pin
單一圖標可複製 SVG, React, Vue 程式碼與下載 SVG, PNG 檔案
Step 4

在右側中有許多能客製化圖標樣式的功能選項,你能夠自定義像是:圖標大小、線段粗細、圖標風格、圖標顏色、端點類型以及拐點類型:

透過右側客製化功能選項自定義圖標外觀Pin
透過右側客製化功能選項自定義圖標外觀

和其他類似的圖標資源不同的地方在於,IconPark 的圖標風格是能夠改變成設定多種顏色的圖標外觀,且還能對圖標的外部描邊、外部填充、內部描邊、內部填充…等等地方進行個別的顏色設定。

此外,最與眾不同的地方在於,你還能改變端點與拐點的類型,端點與拐點都分別有三種不同的呈現方式,讓你能夠在更細節的地方去進行圖標的外觀自定義。

以上就是 IconPark 的完整介紹。如果你還想了解更多線上圖標的資源網站,可以參考:Radix IconsLineIconsEmblemiconsIconstoreIconhub…等等好用的圖標庫。

IconPark - 字節跳動官方出品超過 1287+ 高品質圖標免費下載,可線上客製化圖示外觀樣式Pin

IconPark 評價推薦優點

  • 超過 1287+ 高品質圖標
  • 支援 SVG, PNG, React, Vue…等等格式
  • 可自定義圖標外觀樣式與顏色

Sliven 褚崇名
Sliven 褚崇名

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

文章: 669

發佈留言

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


Share to...