到這裡找色彩設計靈感!12個設計師必備配色表網站


回到總目錄:[年度精選]比軟體更強悍 33 種文書繪圖免費線上工具

當你準備設計一個「網站首頁」、「書籍封面」、「海報視覺」,甚至是每個人都會遇到的「簡報頁面設計」時,「顏色」可能是一個比放了什麼漂亮圖片更重要的元素,網路上有很多討論色彩心理學的文章都說準確的、舒適的色彩應用可以產生迷人的印象。

我自己也不是色彩設計的高手,但最近在研究設計師們會如何選色、配色時,發現了許多線上的自動配色網站,這些網站提供了很多聰明的選色器工具,或是很多具有創意的配色表,可以提供許多「原來可以、應該這樣配色」的好建議,甚至激發設計師們的色彩搭配靈感。

所以今天這篇文章,就讓我把這段時間收集研究的成果,一起分享出來給需要的朋友,或許因為我不是設計師所以下面的解釋不夠專業,但相信這些免費的線上配色表、選色器服務,對設計師們一定有所幫助。





Coolors 最大特色就是提供了免費的「自動配色器」,隨機產生推薦的配色結果,讓你知道那些顏色適合一起搭配使用,在快速產生的多組配色中,也能激發我們的設計靈感。

只要打開 Coolors 的[ Generator ]線上工具,按下空白鍵就能快速切換不同配色,也能在[ Browser ]頁面瀏覽那些設計師們推薦的經典配色。






BrandColors 收集了世界上許多知名品牌的配色表,讓我們知道一個成功品牌如何在它的網頁、產品、 Logos 上做顏色設計,是非常直接有效的參考,也能讓我們下載任何一個品牌的配色表。






Plartton 是一個免費而且強大的配色產生器,他的第一個特色是透過調色盤可以輕鬆的產生符合色彩設計原理的配色表,我們只要在調色盤中選擇一個顏色,就能自動計算顏色對比,產生各種設計建議。


這時候我們還能按下右下方的[ Examples ],在一個模擬網頁中查看這個配色呈現出來的實際效果。






0to255 就是一個快速的顏色挑選網站,我們先選擇一個主要的顏色,接著就可以看到這個色系中所有顏色的對比表,方便我們挑選出一個適合的顏色代碼來使用。






比起機器的配色,或許來自人的色彩設計靈感更能觸動人心, COLOURlovers 由社群用戶分享各種主題的配色靈感,你可以在這裡找到婚禮、印刷、網頁設計的各種配色表,這些配色方法都是由不同的設計師提供,你還能看到大家的評價。






Adobe Color CC 前身是 Adobe Kuler ,從 Photoshop 時代就是設計師們最經典的配色建議工具,透過線上的 Color CC 自動調色盤,經過專業的顏色對比模擬,讓你快速選出適合的配色方案。

我們只要在調色盤上輕鬆拉動滑鼠,就能在專業的色彩設計原理下產生不同的配色結果,或者也能瀏覽 Adobe 上由專業設計師提供的[配色方案]。






如何用這個顏色當介面會怎樣? uicolors 讓你挑選顏色後,可以立刻嘗試看看用這個顏色當作介面底色的實際範例,更容易找出我們想要的效果。






Coleure 不只讓我們挑選喜歡的顏色,還能在右方立刻看到這個顏色搭配黑白文字或其他色彩的版面搭配效果,所見即所得的功能讓我們更容易挑出自己想要的配色。






這個網站讓我們只要貼上照片網址,就能立刻獲得照片裡的配色顏色代碼。






material palette 提供了設計 Android App 時最好的介面配色建議(延伸參考:體驗Android的最佳介面!16款 Android App 精選下載),只要挑選兩個你想要的主要顏色,這個網站就會自動產生一個 App 介面,提供介面中可以選擇的其他配色參考。






這個網站提供了扁平化設計中常用的色彩,只要按下喜愛的扁平化設計常用顏色,就能直接複製 Hex 色碼。






看到一個網站設計覺得很漂亮,想知道它的顏色是怎麼搭配的?那麼只要到 Stylifyme 中輸入網站網址,就能立刻獲得這個網站的配色表啦!對設計師來說是非常實用的參考工具。

以上,就是我這陣子研究收集的配色表、選色器網站,其中有些線上工具的自動配色、推薦選擇功能十分便利,而有些配色建議則可以激發我們的設計靈感。

對設計有興趣、有需求的朋友,也歡迎延伸參考下面的免費設計資源文章

回到總目錄:[年度精選]比軟體更強悍 33 種文書繪圖免費線上工具

轉貼本文時禁止修改,禁止商業使用,並且必須註明來自電腦玩物原創作者 esor huang(異塵行者),及附上原文連結:到這裡找色彩設計靈感!12個設計師必備配色表網站


留言

張貼留言

為了避免垃圾廣告留言過多,開始測試「留言管理」機制,讓我可以更容易回應讀者留言,並更簡單過濾掉廣告,但只要不是廣告留言都會通過審核。

這個網誌中的熱門文章

全家沖印、 7-11 列印照片誰好用?立可得與 ibon教學+比較表

Google Maps 我的地圖完全教學!規劃自助旅行攻略

Slack 完整教學與上手心得:找到正確的團隊溝通之道

Google NotebookLM 免費中文 AI 筆記實例教學,老師、學生、創作者利器

畫張圖說得更清楚! Napkin 用 AI 幫你的簡報文章手繪視覺思考圖

Google 表單自動關閉回覆教學:時間人數到達就過期

會議記錄不麻煩!我常用兩個 Evernote AI 功能整理錄音、手寫筆記

Excalidraw 免費 AI 生成流程圖,一鍵畫出知識圖表、專案流程、寫作大綱

微軟 Bing AI 繪圖工具 Image Creator 免費開放,30秒輕鬆生成圖片

Miro 遠距工作開視覺會議的免費強大白板,專案圖解實例教學