3個免費配色網站+1招萬用配色技巧：色彩搭配0煩惱！

每次都很煩惱要如何挑選顏色嗎？ 這次介紹 3 種免費配色工具，讓你輕鬆完成色彩搭配。同時也分享 1 招萬用配色技巧，讓你即使不用那些調色盤也能配出好看的網站介面！

配色網站

這些都是我主要使用的配色網站，而我的流程通常是先決定一個主要色，其餘的就可以透過輔助工具處理囉！

NIPPON COLORS - 日本の伝統色

• 日本の伝統色 網站連結

這是個日本配色網站，使用得當可以讓你的網站充滿日式風格，點選顏色之後整體顏色會改變方便預覽，有提供 CMYK 和 RGB，把滑鼠移到 RGB 上方也會出現 HTML 色碼表。

使用建議：可以先在這個網站決定一個主要色。

ColorSpace

• ColorSpace 網站連結

決定了主色調後，之後完全沒想法嗎？ ColorSpace 可以提供色彩靈感，只要把 HTML 色碼輸入到畫面中，然後按下 GENERATE，下方就會跑出很多配色方案，喜歡的就可以直接把整個橫向配色表拿來使用囉~

同時這個網站也提供了漸層色的 CSS 程式碼建立服務，點選上方選單的 GRADIENT 就可以找到了，漸層方向也都可以選擇，之後將下方的 CSS 程式碼複製後就可以直接使用。

使用建議：決定主要色後，完全無靈感時可使用。

Palettable

• Palettable 網站連結

這是一個用互動方式去產生配色的工具，點中間的控制桿圖示可以直接調整顏色，之後系統會開始右邊提供建議的配色方案，你只要選喜歡或不喜歡即可，這個配色表最多可以建立 5 個顏色。

使用建議：決定主要色與次要色後可使用，或者想找同個色相中比較適合的配色方案可使用。

萬用配色技巧

黑白灰+強調色

大家總是會希望自己的網站能夠用上自己最愛的色彩們，但其實多數情況下這些色彩們可是會有點衝突的喔（是可以經過調整去和諧一些，但有點技巧）。這時不妨運用減法去思考，把網站改為灰階，並思考自己最想留下的是哪個顏色，把它當作凸顯顏色使用，這樣通常結果都不會糟糕的！

更進階一些之後，則可以考慮用 2 個顏色即可，分別是主要色+次要色，大約是 7:3 的比例製作，向一小時架站大概就是這個概念（沒完全一樣喔），大格局就是藍（背景其實也帶點藍），然後咖啡色作為凸顯使用。

另一個案例是 lasol睡眠屋，大家可以思考看看他們的配色是如何喔！

常見問題