效果與規格

標準 36 色相 × 11 階明度/飽和度 的專業色環，每個色塊精準對齊，帶白色中心、同心圓環分隔線與輻射狀分割線，適合色彩教學、設計參考、UI 色板輸出。

核心算法邏輯：矩陣 → 極座標 → 路徑精準分割

步驟 1：建立色彩矩陣基底

1. 分析目標色環結構：36 格(色相) × 11 格(半徑層級，含中心白)。
2. 新建畫布：按 20 倍放大 → 720×220 px(36×20=720, 11×20=220)。
3. 新建圖層填充 PS 內建「彩虹漸變」(線性、橫向) → 自動生成 36 色相橫向漸變條帶。
4. 添加「漸變映射」調整層：黑白徑向漸變(中心白、邊緣黑)、混合模式「強光」 → 建立從中心到邊緣的明度遞減(模擬色環同心層級)。

步驟 2：馬賽克像素化將連續漸變離散為色塊矩陣

• 濾鏡→像素化→馬賽克，格狀大小設為 20 px(對應放大倍數) → 720×220 畫布瞬間變為 36×11 精確色塊矩陣。

步驟 3：重新設定圖像大小將矩陣壓縮為正方形

• 圖像→圖像大小 → 取消「約束比例」 → 高度設為 720 px(寬度保持 720) → 36×11 矩陣變為 36×36 正方形像素矩陣(每格 20×20 px)，為極座標變換做準備。

步驟 4：極座標變換 —— 矩陣變色環

• 濾鏡→扭曲→極座標 → 選「矩形轉極座標」 → 矩陣行變同心圓環、列變輻射狀分割，色環雛形誕生！

步驟 5：路徑精準構建分割線(向量級精度)

1. 路徑面板新建路徑，橢圓工具按 Shift 畫正圓路徑。
2. Ctrl+T 自由變換路徑：寬高設為 720 px(畫布大小)，居中對齊 → 外環分割線就位。
3. Ctrl+Alt+T 複製變換：以中心為基準，直徑每次縮小 65.5 px(720÷11≈65.5) → 重複 10 次 → 獲得 11 個同心圓路徑(含最外環)。
4. 設置 2px 硬度 100% 白色畫筆 → 鋼筆工具右鍵路徑 → 「描邊路徑」→ 所有同心圓分割線一次性生成，像素級精準。

步驟 6：輻射狀分割線(矩形旋轉複製法)

1. 矩形工具畫 2px 高白色細長矩形(高=分割線寬)，置於中心垂直向上。
2. Ctrl+Alt+T 複製變換：旋轉角度設 10°(360°÷36=10°) → 瘋狂按 Shift+Ctrl+Alt+T 重複 35 次 → 36 條輻射分割線精準成型。

步驟 7：移除中心白圈分割線(兩種方法)

• 法一：路徑面板複製最小圓路徑 → 矢量蒙版「減去」模式貼上。
• 法二：路徑面板選最小圓路徑右鍵「建立選區」 → Alt+點擊輻射分割線圖層蒙版按鈕添加蒙版(自動遮罩中心)。

關鍵技術點總結

• 放大倍數法：以整數倍放大畫布 → 馬賽克格狀 = 倍數 → 縮回正方形 → 極座標，保證色塊絕對精準對齊，無半像素模糊。
• 極座標變換：將笛卡爾座標系(矩陣)轉為極座標系(色環)的數學核心步驟。
• 路徑描邊替代手繪/選區描邊：向量路徑描邊保證分割線寬度、位置、圓度絕對精準，且可無限縮放不失真。
• Ctrl+Alt+T 旋轉複製：製作等角度輻射線的最高效方式。
• 矢量蒙版布爾運算(減去)：非破壞性移除中心多餘分割線。

延伸應用

• 修改初始漸變顏色/方向 → 獲得不同色相排序/色溫傾向的色環。
• 調整馬賽克大小/畫布比例 → 產出不同分級精度(如 12×5、24×8、72×20)色環。
• 導出 SVG(路徑矢量化) → 無限縮放銳利，供印刷/網頁/APP 直接使用。
• 動畫：為同心圓/輻射線設置縮放/旋轉/透明度關鍵幀 → 色環呼吸/旋轉動畫。