【設計資源】- 「 Coolors」: 線上配色網站

今天要來介紹大家一個有趣又實用的網站:「 Coolors」,主要可以當作設計師們線上配色的工具,操作簡單又好用,色碼產生之後,還另外附有多種格式的下載。雖然也有需付費的手機 APP 版本,但我們這邊就先來使用看看免費的網頁版本吧~

網址: https://coolors.co/

進入首頁之後,請點選藍色方塊處。(如下圖)

coolors homepage

 


這邊總共有五個長條色塊可以做色彩搭配,而每個單獨色塊都可以選擇不同的色彩模型,利用滑鼠調整到自己想要的色相後,色碼會在下方即時產生。

coolors - p1

 


如果想要左右移動色塊的話,只要按住底下這個左右箭頭的符號不放,就可以了。

coolors -p2

 


在這裡還提供了一個上傳圖檔的功能(如下圖游標處 ↓) ,假如想要指定圖片裡頭某一種顏色,或是喜歡某張圖片的色彩組合,就可以善加利用此功能喔~

coolors - p3

 

coolors - p4


1. 首先,在上傳圖片之後,用滑鼠選擇想要取代顏色的色塊。

coolors - p5

 


2. 再用滑鼠點選想要取色的地方就可以了,是不是超簡單呀~

coolors - p6

 


3. 假如不想這麼麻煩,也可以選擇 「AUTO」 自動選色功能,會一次幫您抓好五種顏色,點一次不滿意的話,還可以多點幾次,整組配色會隨機跳選變化喔。

coolors - p7

 


最後,如果想要同步調整所有色塊,可以點網頁上方的圈圈 icon ,會自動跳出隱藏的工具列;萬一想要復原已做的調整,只要按後退鍵 icon ,就可以回到上一個步驟喔,真的是太貼心了呢~

coolors - p8

 


對於不想要動到的色塊,只要鎖起來就可以了。

coolors - p9

 


大功告成之後,就可以選擇自己需要的格式,匯出這一組的配色囉!

coolors - p10

 


這就是今天介紹給大家的好用網站資源,希望大家會喜歡這個分享~  ^_^

 

當您對本文有任何問題或指教,歡迎到我們的【飛肯粉絲團】一起交流討論喔!

posted in Free Resource 好康報報, Good Design 好站報報.

回應已關閉。