從圖片擷取調色盤的方法
好的調色盤常常來自一張你喜歡的圖:概念圖、電影畫面、旅行照片。把它的顏色取出來,就是插畫、介面或像素藝術一致風格的起點。
原理
圖片調色盤擷取會先縮小圖片,再用依人眼亮度感知加權的k-means演算法,把相近顏色的像素分群。每個顏色是一群的平均色,下方百分比是在圖中所占的比例。
步驟
- 拖入圖片(不會離開瀏覽器)。
- 選擇顏色數:5~6色抓氛圍,12~16色當像素藝術的工作調色盤。
- 點顏色複製HEX色碼,或整份清單一起複製。
- 匯出成CSS變數,或下載GIMP、Aseprite、Krita、Inkscape可用的
.gpl。
做出更好的調色盤
- 大片留白或天空占滿畫面時,先裁切。
- 試試不同顏色數:6色的調色盤不是12色的一部分。
- 事後調整:取出的顏色是平均值,容易偏灰。提高重點色的彩度,再加入真正的深色與亮色。
用在介面時
擷取的調色盤是風格參考,不是無障礙配色系統。請確認文字與背景的對比(一般文字至少4.5:1)。
切割Sprite Sheet請用精靈圖集切割與合併。