配色靈感最可靠的來源莫過於優秀圖片。本教學系統講解：如何挑選素材圖、四大取色策略（基礎色、互補色、衍生色、整合），以及在 Photoshop 中完整實操「從照片到可用色板」的 9 步標準化流程，適合各階段設計師掌握。

核心取色四大策略

1. 基礎色：鎖定畫面主導色

審視照片，找出佔據面積大、視覺衝擊強的 1-2 個顏色（如深青色、棕色），作為配色方案的錨點，可用於標題、背景、正文等大面積區域。

2. 互補色：引入視覺張力

在色輪上尋找與基礎色對稱的顏色（藍↔黃、綠↔紅）。以一色為主、一色為輔，創造冷暖對比與活力。畫面主色調佔主導，互補色作點綴，主次分明不衝突。

3. 衍生色：擴展色系深度

基於基礎色，通過調整明度/飽和度衍生出同色系的深淺變化（如深綠、中綠、淺綠、淡綠）。色系內部和諧統一，豐富層次又不沖突。基礎色通常不超過 3 個，衍生色足以應對大多數 UI 需求。

4. 整合：構建完整可用色板

基礎色 + 互補色 + 中性色（灰/白/黑）+ 衍生色，調整明度飽和度至協調，輸出標準化色板文件（PS/ID/AI 通用）。

Photoshop 實操 9 步建立色板文件

Step 1：導入素材圖

用 PS 打開挑選好的高質量照片。

Step 2：吸管工具取基礎色與互補色

按 I 切換吸管工具，點選畫面基礎色區域；按 X 切換前背景色，再點選互補色區域。

Step 3：新建色板文檔

檔案 > 新建，尺寸 800 × 200px，RGB 模式，命名「色板」。

Step 4-5：繪製圓形填充基礎色與互補色

按 U 選橢圓工具（按 Shift 畫正圓），用前景/背景色填充。

Step 6：複製圓形準備中性色與衍生色

複製互補色圓形兩份，共四圓承載四類色彩。

Step 7：取中性色填充第三圓

回素材圖吸管取淺灰等中性色填入。

Step 8：製作衍生色填充第四圓

在首圓取色，打開拾色器上移選取高明度同色系色（注意風格一致性，如復古風不宜過亮）。

Step 9：整理輸出通用格式

調整四圓排序佈局，另存為 JPG，供 PS/AI/ID/Figma 等跨軟體取色調用。

設計師成長建議

配色是設計核心竞争力之一。養成「多看優秀作品、多想色彩邏輯、多練取色實操」的習慣，建立個人色板素材庫，長期受益。