一、飽和度與易讀性:高飽和易疲勞
專案中列表文字鏈接統一高飽和藍 #014ccc,吸引注意卻易視覺疲勞。降低飽和度後閱讀顯著舒適。主流門戶網站列表鏈接多用低飽和藍驗證此結論。
結論:顏色飽和度達臨界值,視覺神經興奮引發閱讀疲勞。
二、視覺神經興奮臨界值:波長決定敏感度
光譜紅橙黃綠青藍紫波長遞減,神經興奮所需飽和度呈先增後減弧狀:
長波(紅/橙)與短波(藍/紫)低飽和即易興奮;中波(綠/青)需較高飽和。
藍色屬臨界點低顏色,慎用高飽和藍。
結論:同飽和度下,紅/紫最易興奮>黃/藍>綠/青。
設計建議
- 盡量用低飽和紅、紫
- 禁止高飽和紅、紫
- 少量用高飽和黃、藍
三、明度、色相、飽和度三元關系(RGB 模型解析)
名詞定義
- 明度:明暗程度(0-255 級),0 純黑,255 純白。
- 色相:顏色種類(光譜紅橙黃綠青藍紫及組合)。
- 飽和度:顏色純度/鮮豔度。
RGB 混色規則與計算
- R=G=B 1:1:1 → 白光
- 任意兩原色混合產生新色相,非白光
- 單一原色對明度影響為數值一半(≤127 級)
- 明度 = (RGB 最大值 + 最小值) / 2
- 色相由最大值/最小值位置及中間值決定
- 飽和度 = 最大值 - 最小值 差值
關鍵結論
- 暗色(無通道達 FF)增明度=增飽和,降明度=降飽和
- 亮色(無通道達 00)增明度=降飽和,降明度=增飽和
- 飽和度越大(差值越大),同明度下可變色相種類越少
- 飽和度越小,同明度下可變色相種類越多
- 色相變化不影響明度與飽和度
四、可落地的配色操作指南
- 高飽和紅 #FF0000、紫 #FF00FF 不推薦使用
- 高飽和藍 #1834D1、橙 #FF4E00 可用於少量文字吸引注意,不宜用於列表鏈接
- 列表鏈接藍色調製法:降藍通道降飽和(如 #0000FF→#000099),為避免過暗增其他通道調明度(如 #005599)
- 顏色不協調可降飽和或調色相協調。例:#FF4E00 與 #FF0000 飽和度一致,但紅色更刺眼,因同飽和度下紅色視覺神經更敏感
參考文獻:《基於色度學的人眼彩色探測特性分析》(北京理工大學)、《計算機求解顏色刺激的主波長和興奮純度》(長春光機院)。