當(dāng)你準(zhǔn)備設(shè)計(jì)一個(gè)「網(wǎng)站首頁」、「書籍封面」、「海報(bào)視覺」，甚至是每個(gè)人都會(huì)遇到的「簡報(bào)頁面設(shè)計(jì)」時(shí)，「顏色」可能是一個(gè)比放了什么漂亮圖片更重要的元素，網(wǎng)絡(luò)上有很多討論色彩心理學(xué)的文章都說準(zhǔn)確的、舒適的色彩應(yīng)用可以產(chǎn)生迷人的印象。
我自己也不是色彩設(shè)計(jì)的高手，但最近在研究設(shè)計(jì)師們會(huì)如何選色、配色時(shí)，發(fā)現(xiàn)了許多在線的自動(dòng)配色網(wǎng)站，這些網(wǎng)站提供了很多聰明的選色器工具，或是很多具有創(chuàng)意的配色表，可以提供許多「原來可以、應(yīng)該這樣配色」的好建議，甚至激發(fā)設(shè)計(jì)師們的色彩搭配靈感。
所以今天這篇文章，就讓我把這段時(shí)間收集研究的成果，一起分享出來給需要的朋友，或許因?yàn)槲也皇?a href=http://www.hweehall.com/ target=_blank class=infotextkey>設(shè)計(jì)師所以下面的解釋不夠?qū)I(yè)，但相信這些免費(fèi)的在線配色表、選色器服務(wù)，對(duì)設(shè)計(jì)師們一定有所幫助。
01/
Coolors 最大特色就是提供了免費(fèi)的「自動(dòng)配色器」，隨機(jī)產(chǎn)生推薦的配色結(jié)果，讓你知道那些顏色適合一起搭配使用，在快速產(chǎn)生的多組配色中，也能激發(fā)我們的設(shè)計(jì)靈感。
只要打開 Coolors 的［Generator］在線工具，按下空格鍵就能快速切換不同配色，也能在［Browser］頁面瀏覽那些設(shè)計(jì)師們推薦的經(jīng)典配色。
02/
BrandColors 收集了世界上許多知名品牌的配色表，讓我們知道一個(gè)成功品牌如何在它的網(wǎng)頁、產(chǎn)品、 logos 上做顏色設(shè)計(jì)，是非常直接有效的參考，也能讓我們下載任何一個(gè)品牌的配色表。
03/
Plartton：強(qiáng)大可預(yù)覽的自動(dòng)配色產(chǎn)生器
Plartton 是一個(gè)免費(fèi)而且強(qiáng)大的配色產(chǎn)生器，他的第一個(gè)特色是透過調(diào)色盤可以輕松的產(chǎn)生符合色彩設(shè)計(jì)原理的配色表，我們只要在調(diào)色盤中選擇一個(gè)顏色，就能自動(dòng)計(jì)算顏色對(duì)比，產(chǎn)生各種設(shè)計(jì)建議。
這時(shí)候我們還能按下右下方的［ Examples ］，在一個(gè)模擬網(wǎng)頁中查看這個(gè)配色呈現(xiàn)出來的實(shí)際效果。
04/
0to255 就是一個(gè)快速的顏色挑選網(wǎng)站，我們先選擇一個(gè)主要的顏色，接著就可以看到這個(gè)色系中所有顏色的對(duì)比表，方便我們挑選出一個(gè)適合的顏色代碼來使用。
05/
COLOURlovers：幫你配色的色彩設(shè)計(jì)社群
比起機(jī)器的配色，或許來自人的色彩設(shè)計(jì)靈感更能觸動(dòng)人心， COLOURlovers 由社群用戶分享各種主題的配色靈感，你可以在這里找到婚禮、印刷、網(wǎng)頁設(shè)計(jì)的各種配色表，這些配色方法都是由不同的設(shè)計(jì)師提供，你還能看到大家的評(píng)價(jià)。
06/
Adobe Color CC：來自 Adobe 的專業(yè)選色器
Adobe Color CC 前身是 Adobe Kuler ，從 Photoshop 時(shí)代就是設(shè)計(jì)師們最經(jīng)典的配色建議工具，透過在線的 Color CC 自動(dòng)調(diào)色盤，經(jīng)過專業(yè)的顏色對(duì)比模擬，讓你快速選出適合的配色方案。
我們只要在調(diào)色盤上輕松拉動(dòng)鼠標(biāo)，就能在專業(yè)的色彩設(shè)計(jì)原理下產(chǎn)生不同的配色結(jié)果，或者也能瀏覽 Adobe 上由專業(yè)設(shè)計(jì)師提供的［配色方案］。
07/
如何用這個(gè)顏色當(dāng)界面會(huì)怎樣？ uicolors 讓你挑選顏色后，可以立刻嘗試看看用這個(gè)顏色當(dāng)作接口底色的實(shí)際范例，更容易找出我們想要的效果。
08/
Coleure 不只讓我們挑選喜歡的顏色，還能在右方立刻看到這個(gè)顏色搭配黑白文字或其他色彩的版面搭配效果，所見即所得的功能讓我們更容易挑出自己想要的配色。
09/
Color Palette Generator：從你的真實(shí)照片選出配色
這個(gè)網(wǎng)站讓我們只要貼上照片網(wǎng)址，就能立刻獲得照片里的配色顏色代碼。
10/
material palette： Google Material Design 自動(dòng)配色器
material palette 提供了設(shè)計(jì) Android App 時(shí)最好的接口配色建議，只要挑選兩個(gè)你想要的主要顏色，這個(gè)網(wǎng)站就會(huì)自動(dòng)產(chǎn)生一個(gè) App 接口，提供接口中可以選擇的其他配色參考。
11/
flatuicolors：扁平化設(shè)計(jì)常用色彩
這個(gè)網(wǎng)站提供了扁平化設(shè)計(jì)中常用的色彩，只要按下喜愛的扁平化設(shè)計(jì)常用顏色，就能直接復(fù)制 Hex 色碼。
12/
看到一個(gè)網(wǎng)站設(shè)計(jì)覺得很漂亮，想知道它的顏色是怎么搭配的？那么只要到 Stylifyme 中輸入網(wǎng)站網(wǎng)址，就能立刻獲得這個(gè)網(wǎng)站的配色表啦！對(duì)設(shè)計(jì)師來說是非常實(shí)用的參考工具。
以上，就是我這陣子研究收集的配色表、選色器網(wǎng)站，其中有些在線工具的自動(dòng)配色、推薦選擇功能十分便利，而有些配色建議則可以激發(fā)我們的設(shè)計(jì)靈感。
全部評(píng)論