2020設計師最佳配色工具盤點(58+網站合集)

眾所周知,配色是設計中非常重要的部分,一個好的配色不僅能讓我們的設計更加出彩,還能對使用者產生情感影響。

1.Muzli Colors

https://colors。muz。li

可以線上快速生成和編輯多種配色方案,並根據我們自己的顏色選擇預覽和下載自定義UI工具包。

2020設計師最佳配色工具盤點(58+網站合集)

2. Colorable

https://colorable。jxnblk。com/

一款非常實用、用來評估配色可訪問性的工具。

2020設計師最佳配色工具盤點(58+網站合集)

3. History’s Palettes

https://colorleap。app/home

一鍵生成復古配色,搜尋過去4000年來最具有代表性的的180個配色方案。

2020設計師最佳配色工具盤點(58+網站合集)

4. Picular

https://picular。co/

Picular是一款基於谷歌影象搜尋的色彩生成器,只需輸入描述詞,就能快速生成配色方案。

2020設計師最佳配色工具盤點(58+網站合集)

5. Colourcode

https://colourco。de/

Colourcode是一個讓色彩理論視覺化的配色網站,選定一個顏色即就能看到它的互補色、相似色等等。

2020設計師最佳配色工具盤點(58+網站合集)

6. Palettte App

https://palettte。app/

palettte是一款色彩編輯和重對映工具,能夠視覺化的看到不同顏色之間的過渡流暢度,匹配出更和諧的色彩,還支援單個顏色微調。我們還可以匯入、分析和編輯現有的色彩方案。

2020設計師最佳配色工具盤點(58+網站合集)

7. Colorinspire

https://www。colorinspire。io/

收錄了很多場景的精選配色方案,為我們提供源源不斷的色彩靈感。

2020設計師最佳配色工具盤點(58+網站合集)

8. ColorSpace

https://mycolor。space/

Color Space是一款非常實用的漸變生成器,我們只需要選擇一個顏色,就可以快速生成20~30種不同風格的配色方案。

2020設計師最佳配色工具盤點(58+網站合集)

9. Pigment

https://pigment。shapefactory。co/

Pigment可以透過飽和度、色溫以及色系來生成我們獨特的配色方案,還可以檢視不同配色的配色場景圖片。

2020設計師最佳配色工具盤點(58+網站合集)

10. Adobe Color

https://color。adobe。com/create

Adobe Color透過拖拽色輪或輸入自定義色值,我們可以創造出基於相似、互補、三原色等不同色彩規則的配色方案。除此之外,還支援CMYK、RGB、HSV多種色彩模式的配色調整。

2020設計師最佳配色工具盤點(58+網站合集)

11. Colors & Fonts

https://www。colorsandfonts。com/

Colors&Fonts是由國外一名設計師Michael Andreuzza建立的配色網站,裡面收錄了超多他精心收藏的配色方案,我們只需要輸入描述詞,網站就會推薦相應的配色方案,除此之外還有漸變、字型等多種選擇,一鍵複製色值。

2020設計師最佳配色工具盤點(58+網站合集)

12. HueSnap

https://www。huesnap。com/

「HueSnap」是一款實用的取色工具,我們可以從影象中捕捉到色彩的詳細資訊,包括十六進位制、RGB、CMYK、HSV、HSL等等。除此之外,我們還可以在社群中瀏覽超多非常棒的配色方案靈感,並收藏和儲存它們。

2020設計師最佳配色工具盤點(58+網站合集)

13. Culrs

https://culrs。com/

Culrs是一個綜合型的配色網站,可以透過鄰近色、三色、四色和單色來搜尋靈感配色。除此之外,每種色彩規則下還有明暗分類,相當方便。

2020設計師最佳配色工具盤點(58+網站合集)

14. Eva Design System

https://colors。eva。design/

Eva Design System是一個基於深度學習演算法的配色網站,適用於給我們的產品或品牌生成一個系統的配色方案。

2020設計師最佳配色工具盤點(58+網站合集)

15. Scale

https://hihayk。github。io/scale/

快速色標生成器

2020設計師最佳配色工具盤點(58+網站合集)

16. Site Palette

http://palette。site/

Site Palette是一款設計師和前端開發人員必備的谷歌外掛。可以自動吸取網站的主要顏色,幫助我們建立色板,以及尋找相關配色的圖片,並一鍵下載配色方案。

2020設計師最佳配色工具盤點(58+網站合集)

17. BrandColors

https://brandcolors。net/

BrandColors是最大的官方品牌配色合集。有包括500多個品牌的十六進位制顏色程式碼,包括Facebook,Twitter,Instagram等等。

2020設計師最佳配色工具盤點(58+網站合集)

18. Colorwise

https://colorwise。io/

Colorwise將時下最受歡迎的配色方案按照適用場景分類,以便我們快捷地尋找配色靈感。

2020設計師最佳配色工具盤點(58+網站合集)

19. HTML Color Codes

https://htmlcolorcodes。com/

顏色圖表和帶有Hex顏色程式碼,RGB和HSL值的HTML顏色名稱,輕鬆查詢網站的HTML顏色程式碼。

2020設計師最佳配色工具盤點(58+網站合集)

20. ColorBox

https://www。colorbox。io/

ColorBox可以幫助我們輕鬆地建立非常炫酷的色彩集,配色頁面還有大量的個性化選項,滿足我們的任何需求~

2020設計師最佳配色工具盤點(58+網站合集)

21. Generate — Coolors.co

https://coolors。co/

幾秒鐘之內建立,儲存並分享好看的配色方案。

2020設計師最佳配色工具盤點(58+網站合集)

22. Color — Cloudflare Design

https://cloudflare。design/color/

專為UI設計師建立的配色工具,支援根據使用者介面元素預覽配色、迴圈瀏覽可訪問的顏色組合並手動建立配色方案、透過網址匯入或生成配色。

2020設計師最佳配色工具盤點(58+網站合集)

23. Instant Duotone Effect Generator

https://duotones。co/

雙色調效果生成器,支援使用者線上選擇多達幾十種雙色調配色。

2020設計師最佳配色工具盤點(58+網站合集)

24. Material Design

https://material。io/resources/color/#!/?view。left=0&view。right=0

為UI建立和共享調色盤,並測量任何顏色組合的可訪問性。

2020設計師最佳配色工具盤點(58+網站合集)

25. Blendy

https://blendy。ml/

Blendy是一種快速預覽CSS背景混合模式的工具。我們可以使用混合模式,顏色,漸變並在影象上進行嘗試。

2020設計師最佳配色工具盤點(58+網站合集)

26.LOL Colors

https://www。webdesignrankings。com/resources/lolcolors/

LOL Colors是一款可愛的配色網站,色彩大多明快清新,直接拖動滑鼠即顯示色值,方便收藏色卡。

2020設計師最佳配色工具盤點(58+網站合集)

27. Color Hunt

https://colorhunt。co/

Color Hunt是一個免費開放的色彩靈感平臺,擁有數千種時尚的配色方案。

2020設計師最佳配色工具盤點(58+網站合集)

28. ColorMe

https://colorme。io/

一個簡單CSS色彩視覺化工具,其特點是有非常多的引數可以設定,包括:透明度、飽和度、色調、亮度、著色、陰影、R/G/B、白色、黑色、對比度的設定等等。

2020設計師最佳配色工具盤點(58+網站合集)

29. Polarite

https://www。polarite。app/

Polarite是一款智慧配色應用程式,使用者只需左右滑動顏色選擇喜歡/不喜歡的色彩,系統就會根據其結果智慧生成一系列我們喜歡的且和諧的配色方案。

2020設計師最佳配色工具盤點(58+網站合集)

30. Gradient Hunt

https://gradienthunt。com/

精選數千種時尚的漸變色,並且每天都會更新。

2020設計師最佳配色工具盤點(58+網站合集)

31. Palettable

www。palettable。io

可以自己隨意搭配色彩方案的網站,使用者只需要選擇喜歡/不喜歡,直到搭配出想要的色板。

2020設計師最佳配色工具盤點(58+網站合集)

32. ColorSpark

https://colorspark。app/

一個簡單而有效的工具,隨機生成好看的顏色、漸變色,可以一鍵複製 CSS 程式碼。

2020設計師最佳配色工具盤點(58+網站合集)

33. SVG Colorizer

https://www。iconshock。com/svg-color/

SVG著色器,自動為SVG圖示和SVG向量著色

2020設計師最佳配色工具盤點(58+網站合集)

34. Sip

https://sipapp。io/

適用於Mac的Sip ColorPicker。可以幫助我們更好的收集整理和分享配色方案。

2020設計師最佳配色工具盤點(58+網站合集)

35. CoolHue 2.0

https://webkul。github。io/coolhue/sketch-plugin/

一款免費的sketch漸變配色外掛和收集工具。

2020設計師最佳配色工具盤點(58+網站合集)

36. Color Koala

https://colorkoala。xyz/

Color Koala是一個快速配色生成器。

2020設計師最佳配色工具盤點(58+網站合集)

37. SchemeColor

https://www。schemecolor。com/

SchemeColor可以下載、建立和分享成千上萬種美麗的配色組合,獲取十六進位制顏色程式碼的詳細資訊,並將其轉換為RGB和CMYK等色彩模式。

2020設計師最佳配色工具盤點(58+網站合集)

38. Free Mesh Gradient Collection

https://www。ls。graphics/meshgradients

100多個免費的漸變色合集,支援sketch、png、ai、jpg、eps等多種格式下載。

2020設計師最佳配色工具盤點(58+網站合集)

39. WebGradients

https://webgradients。com/

WebGradients是一個由頂級設計師策劃的免費漸變配色網站,擁有180種漂亮的線性漸變,並支援CSS3、Photoshop和Sketch等多種格式。

2020設計師最佳配色工具盤點(58+網站合集)

40. Gradient Buttons

https://gradientbuttons。colorion。co/

炫酷的漸變按鈕,還有懸停的動畫效果,一鍵copy css程式碼。

2020設計師最佳配色工具盤點(58+網站合集)

41. ColorKit

https://colorkit。io/

多種色彩漸變生成器,只需輸入開始和結束顏色以及混合步驟數,就能一鍵生成流暢的配色方案,並支援svg格式匯出。

2020設計師最佳配色工具盤點(58+網站合集)

42. Eggradients

https://www。eggradients。com/

一款收錄了最新設計趨勢漸變色彩的配色網站,支援一鍵複製十六進位制和CSS程式碼。

2020設計師最佳配色工具盤點(58+網站合集)

43. Cool Backgrounds

https://coolbackgrounds。io/

Cool Background是設計師Moe Amaya將5個開源生成器的簡化版整理組成的工具集,內建五種背景風格,每一個種風格還提供了簡單的引數配置。分別是:

低多邊形風格

trianglify。io

2020設計師最佳配色工具盤點(58+網站合集)

動態粒子效果

marcbruederlin。github。io/particles。js

2020設計師最佳配色工具盤點(58+網站合集)

漸變

cssgradient。io

2020設計師最佳配色工具盤點(58+網站合集)

漸變層生成器

s。muz。li/NTFiZjk0ZWFh

2020設計師最佳配色工具盤點(58+網站合集)

Unsplash圖片集

unsplash。com

2020設計師最佳配色工具盤點(58+網站合集)

44. Art Palette

https://artsexperiments。withgoogle。com/artpalette/

基於Google AI的智慧配色工具,它會根據你所提供的配色方案來提供相符合的配色主題的藝術圖片。

2020設計師最佳配色工具盤點(58+網站合集)

45. GradPad

http://ourownthing。co。uk/gradpad。html

CSS漸變生成器,我們可以自己設定漸變色彩、透明度、位置和角度,還可以檢視流行的熱門漸變色彩,並直接使用現成的顏色程式碼。

2020設計師最佳配色工具盤點(58+網站合集)

46. Khroma

http://khroma。co/

Khroma號稱是“設計師的AI顏色工具” ,會先讓你從大量的顏色中選擇你最喜歡的50種,然後利用神經網路驅動演算法來幫你生成最符合你審美要求的配色方案,並且它所有給出的的配色都是從最流行的配色方案中學習得來。

2020設計師最佳配色工具盤點(58+網站合集)

47. Color palettes

ttps://www。canva。com/colors/color-palettes/

Canva上數千種精選色彩組合

2020設計師最佳配色工具盤點(58+網站合集)

48. Color Safe

http://colorsafe。co/

Color Safe是一個基於Web內容無障礙指南(WCAG)的配色網站,可以根據我們提供的色彩檢測可訪問性,並給出相應的調整方案。

2020設計師最佳配色工具盤點(58+網站合集)

49. Paletton

http://paletton。com/#uid=1000u0kllllaFw0g0qFqFg0w0aF

Paletton 是一個線上的色環配色工具。我們可以根據需要選擇單色、相近色、對比色等規則來檢視配色,也可以實時檢視其在網頁中的搭配效果。

2020設計師最佳配色工具盤點(58+網站合集)

50. Colordot

https://color。hailpixel。com/

動一動滑鼠就可以不斷生成的新的色卡。非常適合毫無靈感、不知從何下手的設計師。

2020設計師最佳配色工具盤點(58+網站合集)

51. Colors

https://klart。io/colors/

100%由資料驅動的配色方案集合。

2020設計師最佳配色工具盤點(58+網站合集)

52. Contrast Ratio

https://contrast-ratio。com/

一款輕鬆計算顏色對比度的配色工具。

2020設計師最佳配色工具盤點(58+網站合集)

53. Color Lisa

http://www。colorlisa。com/

世界上最偉大的藝術家的色彩傑作。

2020設計師最佳配色工具盤點(58+網站合集)

54. Color Designer

https://colordesigner。io/

只需選擇一種顏色,Color Designer就會幫助我們構建一個系統的配色方案,並基於我們所選的顏色生成多種色調和陰影等。

2020設計師最佳配色工具盤點(58+網站合集)

55. Color.review

https://color。review/

測試顏色對比度的配色工具

2020設計師最佳配色工具盤點(58+網站合集)

56. Blend

http://www。colinkeany。com/blend/

Blend - 建立和自定義漂亮的CSS3漸變。

2020設計師最佳配色工具盤點(58+網站合集)

57. Contrast

https://usecontrast。com/

一個用於快速測試WCAG顏色對比度的macOS應用程式

2020設計師最佳配色工具盤點(58+網站合集)

58. Grabient

https://www。grabient。com/

一個非常漂亮且實用的漸變網站,支援 CSS 樣式程式碼複製、360度漸變旋轉、自由增加或刪除漸變顏色等功能。

2020設計師最佳配色工具盤點(58+網站合集)