編輯導(dǎo)語：圖標(biāo)是用戶頁面不可缺少的元素，本篇文章作者分享了國內(nèi)外比較優(yōu)質(zhì)的圖標(biāo)網(wǎng)站、設(shè)計(jì)師以及團(tuán)隊(duì)分享，有需要的小伙伴一起來看看吧，希望對(duì)你有幫助。

一、圖標(biāo)網(wǎng)站分享

設(shè)計(jì)圖標(biāo)前通常會(huì)找很多參考作為設(shè)計(jì)靈感，下面推薦國內(nèi)外比較優(yōu)質(zhì)的圖標(biāo)網(wǎng)站。給大家做參考。

1. https://remixicon.com/

套面向設(shè)計(jì)師和開發(fā)者的開源圖標(biāo)庫。質(zhì)量很高，風(fēng)格中性大氣，因此適用于很多風(fēng)格的項(xiàng)目，圖標(biāo)以24×24網(wǎng)格為基準(zhǔn)，分為“線性圖標(biāo)”和“面型圖標(biāo)”兩種風(fēng)格。支持全部打包下載，也支持單獨(dú)下載。

2. https://feathericons.com/

簡單漂亮的開源圖標(biāo)，支持在線修改顏色、屬性，功能強(qiáng)大。

3. https://akveo.github.io/eva-icons/#/

設(shè)計(jì)風(fēng)格干凈、簡約，網(wǎng)站提供這些圖案的各種預(yù)覽效果（縮放、抖動(dòng)、翻轉(zhuǎn)）。Eva Icons 有兩種不同樣式，包括只有外框線條的 Outline 或者填滿色彩的 Fill。

4. https://heroicons.dev/

Heroicons是由Tailwind CSS的創(chuàng)建者構(gòu)建的另一個(gè)很棒的開源圖標(biāo)庫。它具有超過165個(gè)具有填充和輪廓樣式的獨(dú)立圖標(biāo)，但每個(gè)元素也提供深色和白色版本，圖標(biāo)的外觀非常優(yōu)質(zhì)且制作精良。

5. https://www.iconfont.cn/

iconfont-阿里巴巴體驗(yàn)團(tuán)隊(duì)打造,設(shè)計(jì)和前端開發(fā)的便捷工具。功能很強(qiáng)大且圖標(biāo)內(nèi)容很豐富的矢量圖標(biāo)庫，提供矢量圖標(biāo)下載、在線存儲(chǔ)、格式轉(zhuǎn)換等功能。

6. http://iconpark.oceanengine.com/official

IconPark 是字節(jié)跳動(dòng)公司內(nèi)部產(chǎn)品體系使用的官方圖標(biāo)庫，可以實(shí)現(xiàn)根據(jù)單一 SVG 源文件變換出多種主題，具備豐富的分類、更輕量的代碼和更靈活的使用場景。

提供超過 2000+ 預(yù)設(shè)圖標(biāo)、32 種圖標(biāo)分類；支持 4 種主題和在線換膚：線性、填充、雙色、四色。

網(wǎng)站提供多種便捷操作：復(fù)制 SVG code、復(fù)制 React 組件、復(fù)制 Vue 組件、下載 PNG、下載 SVG，無論是設(shè)計(jì)師還是開發(fā)者，使用起來都非常方便；針對(duì)前端開發(fā)者，還提供多種 NPM 包下載。

7. https://ikonate.com/

Ikonate是一組設(shè)計(jì)精美且經(jīng)過精心優(yōu)化的圖標(biāo)庫，支持自定義調(diào)整邊框、圓角等樣式顏色。

二、圖標(biāo)設(shè)計(jì)師/團(tuán)隊(duì)分享

國內(nèi)外有非常多的團(tuán)隊(duì)在dribbble上發(fā)布圖標(biāo)，也可以成為我們工作中的參考。當(dāng)然也可以作為日常賞析。

Dribbble：Vitality Studio；

https://dribbble.com/Vitality_Studio；

Vitality Studio團(tuán)隊(duì)作品都是3D立體質(zhì)感的設(shè)計(jì)。

Dribbble：MVBen；

https://dribbble.com/MVBen；

質(zhì)感風(fēng)，圖標(biāo)設(shè)計(jì)細(xì)節(jié)及風(fēng)格都是很厲害的設(shè)計(jì)師。

Dribbble：Nucleo；

https://dribbble.com/nucleo；

專門做線性圖標(biāo)的團(tuán)隊(duì)，上傳的作品全是一整套的線形圖標(biāo)！參考價(jià)值非常高。

Dribbble：Yoga Perdana；

https://dribbble.com/yoga；

設(shè)計(jì)師發(fā)布的圖標(biāo)絕大部分是層疊式的啟動(dòng)圖標(biāo)設(shè)計(jì)風(fēng)格。

三、小結(jié)

整個(gè)圖標(biāo)設(shè)計(jì)分為三篇來講述的。

《理論篇》主要講述圖標(biāo)設(shè)計(jì)的概念以及設(shè)計(jì)原則等理論內(nèi)容；

《工作篇》主要講述工作中圖標(biāo)設(shè)計(jì)過程以及圖標(biāo)落地；

《分享篇》主要分享圖標(biāo)設(shè)計(jì)的工具、圖標(biāo)網(wǎng)站、圖標(biāo)設(shè)計(jì)團(tuán)隊(duì)或者設(shè)計(jì)師。

第三篇內(nèi)容就到這里結(jié)束了。

本文由 @卡洛設(shè)計(jì) 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理。未經(jīng)許可，禁止轉(zhuǎn)載。

題圖來自 Unsplash ，基于 CC0 協(xié)議。