UI 設(shè)計(jì)中，顏色幾乎是最先被感知到的設(shè)計(jì)元素，好的色彩感知是成為一個(gè)優(yōu)秀的設(shè)計(jì)師的基礎(chǔ)，配色網(wǎng)站工具層出不窮，辭典醬在篩選了100多種配色工具后，精選了這25個(gè)配色網(wǎng)站，相信一定會(huì)幫到您！
Cool Background 是產(chǎn)品設(shè)計(jì)師 Moe Amay 創(chuàng)建，是由5個(gè)開源生成器整理組成的彩色圖像工具集，內(nèi)置5種不同的背景風(fēng)格，每一種風(fēng)格還提供了簡(jiǎn)單的參數(shù)配置。非常的炫酷美觀，你可以將其添加到博客、網(wǎng)站或桌面和手機(jī)墻紙中。
網(wǎng)站鏈接：https://coolbackgrounds.io/
△ 多彩抽象三角形 trianglify.io
△動(dòng)態(tài)粒子效果 marcbruederlin.github.io/particles.js
△漸變 cssgradient.io
△?漸變層生成器 s.muz.li/NTFiZjk0ZWFh
△?Unsplash圖片集 unsplash.com
Picular 是一款基于谷歌圖像搜索的色彩生成器，只需輸入描述詞，就能快速生成配色方案。
網(wǎng)站鏈接：https://picular.co/
Palettte 是一款色彩編輯和重映射工具，能夠可視化的看到不同顏色之間的過(guò)渡流暢度，匹配出更和諧的色彩，還支持單個(gè)顏色微調(diào)。我們還可以導(dǎo)入、分析和編輯現(xiàn)有的色彩方案。
網(wǎng)站鏈接：https://palettte.app/
Pigment 可以通過(guò)飽和度、色溫以及色系來(lái)生成我們獨(dú)特的配色方案，還可以查看不同配色的配色場(chǎng)景圖片。
網(wǎng)站鏈接：https://pigment.shapefactory.co/
Muzli Colors 是一款調(diào)色板生成器，可以自己添加顏色代碼或名稱查看相關(guān)的配色，預(yù)覽 UI 套件演示，也可以選擇初始顏色，快速生成和編輯多種配色方案，并根據(jù)我們自己的顏色選擇預(yù)覽和下載自定義 UI 工具包。
網(wǎng)站鏈接：https://colors.muz.li
Colorable 一款非常實(shí)用、用來(lái)評(píng)估配色可訪問(wèn)性的工具。
網(wǎng)站鏈接：https://colorable.jxnblk.com/
一鍵生成復(fù)古配色，可以搜索過(guò)去4000年來(lái)最具有代表性的的180個(gè)配色方案。
網(wǎng)站鏈接：https://colorleap.app/home
基于 Google AI 的智能配色工具，它會(huì)根據(jù)你搜索的配色方案提供相符合的配色主題的藝術(shù)圖片。
網(wǎng)站鏈接：https://artsexperiments.withgoogle.com/artpalette/
Color Space 是一款非常實(shí)用的漸變生成器，我們只需要選擇一個(gè)顏色，就可以快速生成20-30種不同風(fēng)格的配色方案。同時(shí)還提供了梯度和三色漸變選項(xiàng)，可以快速生成配色并查看 CSS 代碼。
網(wǎng)站鏈接：https://mycolor.space/
Adobe Color 通過(guò)拖拽色輪或輸入自定義色值，可以創(chuàng)造出基于相似、互補(bǔ)、三原色等不同色彩規(guī)則的配色方案。除此之外，還支持 CMYK、RGB、HSV 多種色彩模式的配色調(diào)整。
網(wǎng)站鏈接：https://color.adobe.com/create
Eva Design System 是一個(gè)基于深度學(xué)習(xí)算法的配色網(wǎng)站。適用于給我們的產(chǎn)品或品牌生成一個(gè)系統(tǒng)的配色方案。
網(wǎng)站鏈接：https://colors.eva.design/
Site Palette 是一款設(shè)計(jì)師和前端開發(fā)人員必備的谷歌插件。可以自動(dòng)吸取網(wǎng)站的主要顏色，幫助我們建立色板，以及尋找相關(guān)配色的圖片，并一鍵下載配色方案。
網(wǎng)站鏈接：http://palette.site/
BrandColors 是最大的官方品牌配色合集。包含500多個(gè)品牌的16進(jìn)制顏色代碼，包括 Facebook，Twitter，Instagram 等等。
網(wǎng)站鏈接：https://brandcolors.net/
ColorBox 是用于生成顏色集的顏色工具。可以幫助我們輕松地創(chuàng)建非常炫酷的色彩集，配色頁(yè)面還有大量的個(gè)性化選項(xiàng)，滿足我們的任何需求。
網(wǎng)站鏈接：https://www.colorbox.io/
專為 UI 設(shè)計(jì)師創(chuàng)建的配色工具，支持根據(jù)用戶界面元素預(yù)覽配色、循環(huán)瀏覽可訪問(wèn)的顏色組合并手動(dòng)創(chuàng)建配色方案、通過(guò)網(wǎng)址導(dǎo)入或生成配色。
網(wǎng)站鏈接：https://cloudflare.design/color/
LOL Colors 是一款可愛(ài)的配色網(wǎng)站，色彩大多明快清新，直接拖動(dòng)鼠標(biāo)即顯示色值，方便收藏色卡。
網(wǎng)站鏈接：https://www.webdesignrankings.com/resources/lolcolors/
Eggradients 是一款收錄了最新設(shè)計(jì)趨勢(shì)漸變色彩的配色網(wǎng)站，以雞蛋的形式展現(xiàn)。支持一鍵復(fù)制16進(jìn)制和 CSS 代碼。
網(wǎng)站鏈接：https://www.eggradients.com/
SVG 著色器，自動(dòng)為 SVG 圖標(biāo)和 SVG 矢量著色?？梢赃x擇不同的圖標(biāo)生成不同的配色，也可根據(jù)自己的喜好添加新的配色或者是修改現(xiàn)有的配色方案。
網(wǎng)站鏈接：https://www.iconshock.com/svg-color/
CoolHue 2.0是一款免費(fèi)的 Sketch 漸變配色插件和收集工具。
網(wǎng)站鏈接：https://webkul.github.io/coolhue/sketch-plugin/
包含100多個(gè)免費(fèi)的漸變色合集，支持 Sketch、PNG、AI、JPG、EPS 等多種格式下載。
網(wǎng)站鏈接：https://www.ls.graphics/meshgradients
WebGradients 是一個(gè)由頂級(jí)設(shè)計(jì)師策劃的免費(fèi)漸變配色網(wǎng)站，擁有180種漂亮的線性漸變，并支持 CSS3、Photoshop 和Sketch 等多種格式。
網(wǎng)站鏈接：https://webgradients.com/
炫酷的漸變按鈕，還有懸停的動(dòng)畫效果,還可以一鍵 Copy CSS 代碼。
網(wǎng)站鏈接：https://gradientbuttons.colorion.co/
Color palettes 上包含了數(shù)千種精選色彩組合。
網(wǎng)站鏈接：https://www.canva.com/colors/color-palettes/
Paletton 是一個(gè)在線的色環(huán)配色工具。我們可以根據(jù)需要選擇單色、相近色、對(duì)比色等規(guī)則來(lái)查看配色，也可以實(shí)時(shí)查看其在網(wǎng)頁(yè)中的搭配效果。
網(wǎng)站鏈接：http://paletton.com/#uid=1000u0kllllaFw0g0qFqFg0w0aF
Grabient 一個(gè)非常漂亮且實(shí)用的漸變網(wǎng)站，支持 CSS 樣式代碼復(fù)制、360度漸變旋轉(zhuǎn)、自由增加或刪除漸變顏色等功能。
網(wǎng)站鏈接：https://www.grabient.com/
更多配色方法：
歡迎關(guān)注作者微信公眾號(hào)：「UX辭典」
復(fù)制本文鏈接 文章為作者獨(dú)立觀點(diǎn)不代表優(yōu)設(shè)網(wǎng)立場(chǎng)，未經(jīng)允許不得轉(zhuǎn)載。
繼續(xù)閱讀本文相關(guān)話題
發(fā)評(píng)論！每天贏獎(jiǎng)品
點(diǎn)擊 登錄 后，在評(píng)論區(qū)留言，系統(tǒng)會(huì)隨機(jī)派送獎(jiǎng)品
2012年成立至今，是國(guó)內(nèi)備受歡迎的設(shè)計(jì)師平臺(tái)，提供獎(jiǎng)品贊助 聯(lián)系我們
標(biāo)志設(shè)計(jì)標(biāo)準(zhǔn)教程
已累計(jì)誕生 729 位幸運(yùn)星
發(fā)表評(píng)論 為下方 8 條評(píng)論點(diǎn)贊，解鎖好運(yùn)彩蛋
↓ 下方為您推薦了一些精彩有趣的文章熱評(píng) ↓