多數人以為品牌主色一旦卡在無障礙對比檢查，只剩兩條路可選：整套換掉，或者硬用原色賭一把。把品牌色貼進線上對比檢測工具，量出來遠低於及格線的數字，是很多做設計系統的人都踩過的經驗，而且落差往往不小，逼得人得在放棄識別度跟放著使用者看不清楚之間選一個。
這道及格線來自 W3C 訂的 WCAG 對比準則：一般文字與背景的對比要達到 4.5:1，大字級可以放寬到 3:1。品牌色過不了這道對比檢查，原因不是顏色選錯，而是多數品牌主色是為了辨識度與情感聯想挑出來的高飽和度色，像鮮紅、鮮橙、正黃或某種特定品牌藍，這類色相的明度剛好落在中段，不論搭白底或黑底都容易落在臨界區。硬撐著用不合格的顏色，看不清內容的常常是視力較弱的那群使用者；把品牌色整套換掉，又等於丟掉多年累積的識別度。其實還有第三條路：把一支品牌色系統化拆成一組色階，讓不同用途各自對應到過得了關的那一格，品牌識別跟可讀性不必二選一。
品牌主色的高飽和度天生撞上 4.5:1 的數學門檻
對比檢查不合格，通常不是「這個顏色選錯了」，而是撞到一個運算上的門檻。WCAG 判斷對比合不合格，看的是兩個顏色的相對亮度差，公式是 （L1+0.05）/（L2+0.05），L1 是較亮那個顏色的相對亮度，L2 是較暗那個。W3C 在準則說明裡直接點出色相本身不是這條公式判斷的關鍵因素，對比合不合格，跟顏色好不好看是兩件事。
這道門檻對一般文字要求至少 4.5:1，字級夠大時（18pt 以上，或 14pt 粗體以上，約等於 24px 或 18.5px 粗體）放寬到 3:1。4.5:1 這個數字不是隨便訂的，它對應大約 20/40 的視力，也就是常被引用為 80 歲長者的典型視力水準，這道門檻對應的是視力隨年齡自然退化的一大群人，不是少數特例。
問題出在多數品牌主色是為了辨識度與情感聯想挑出來的高飽和度色，像鮮紅、鮮橙、正黃或某種特定品牌藍。這類色相的明度剛好落在中段，不管搭白底或黑底，都容易落在對比不足的臨界區，設計師選色的判斷並沒有出錯，而是這類色相在對比演算法下，天生的活動空間就窄。台灣的網站無障礙規範也採用同一套國際 WCAG 對比門檻，一般文字 4.5:1、大字 3:1，這不是本地另訂一套寬鬆或嚴格的標準，跨市場是一致的。這件事要先講清楚，它是一個數學問題，不是審美問題，也不是換一個好看一點的顏色就能解決。
品牌色過關與否，看的是承載資訊還是純裝飾
「品牌識別跟無障礙，只能二選一」是最常見的誤解。WCAG 本身把畫面內容分成兩種角色來看待：一種承載資訊、需要被讀懂或操作，像文字、連結、按鈕文字、表單邊框、焦點指示，這部分才要卡 4.5:1 或 3:1 的門檻；另一種不承載資訊、純粹裝飾，像 logo、大面積背景色塊、單純裝飾用的圖形，WCAG 明文豁免這類東西的對比要求。品牌色能不能用，從來不是全有全無的問題，而是看它在畫面裡扮演哪個角色。
這裡有個最容易被忽略、也最容易被誤用的細節，logo 的豁免只給 logo 本身的文字與圖形，「品牌識別規範」這件事本身並不是豁免的理由。品牌色用在 logo 以外的一般文字上，不會因為這是品牌規範規定的顏色就自動免責，這正是很多團隊誤解最深的地方。
logo 與大面積裝飾不受對比門檻限制
真的落在豁免範圍內的，是 logo 與 logotype 本身的文字或圖形、大面積純裝飾背景色塊，以及不承載資訊的裝飾圖形，也就是拿掉也不影響讀者理解畫面的那種。這些地方的品牌原色可以直接沿用，不必為了對比檢查降低飽和度或整個換色。
但邊界要抓清楚。如果 logo 同時也是可點擊的連結，像網站頁首常見的做法，它就不再只受 logo 豁免保護，還要另外符合 UI 元件的 3:1 門檻。W3C 給的建議是挑一個對比夠的 logo 變體，或是另外提供一個對比合格、功能相同的連結元件。裝飾圖形的道理一樣，如果它其實承載了理解畫面所需的資訊，拿掉會讓人看不懂內容，就不算純裝飾，還是要過 3:1。
文字、按鈕與焦點框，才是門檻真正鎖住的地方
真的落在門檻內、不能拿「這是品牌色」當理由跳過的，是一般內文文字與圖像化文字（4.5:1）、大字級標題（3:1）、按鈕上的文字（依字級適用 4.5:1 或 3:1）、UI 元件的可視邊界如按鈕外框、輸入框邊框、切換開關（對相鄰背景要 3:1），以及焦點指示框（同樣要 3:1）。
「承載資訊」的判準本身就寫在 WCAG 裡，不是設計師自己主觀認定的：一段視覺資訊只要是讓使用者辨識 UI 元件存在與怎麼操作它、或理解內容所必需的，就落在門檻內。文字要不要照原色用，答案不是看設計師覺得重不重要，而是看它是不是讀者理解與操作這個介面時真正依賴的東西。
把一支品牌色切成分工清楚的色階
對比不合格時常見的兩種反應，其實都在犧牲一邊。一種是整套換掉，換成一個更安全但沒辨識度的顏色，丟了差異化；另一種是明知不合格還是硬用原色，排除了一群使用者，也留下可議的風險。真正的做法不是選一個能過關的顏色來取代品牌色，而是把品牌色系統化拆成一整組深淺變體，也就是色階，讓不同用途各自對應到色階裡過得了對比的那一格。品牌原色本身仍保留在色階的基準位置，繼續用在 logo 與大面積裝飾上，呼應前面談過的分層邏輯。
Adobe 在 2022 年由設計師 Nate Baldwin 主導改版旗下橫跨 100 多款產品的色彩系統 Spectrum，推出 6.0 版，是這套做法業界怎麼落地的具體案例。原本的灰階系統雖然符合 WCAG 對比最低標準，但團隊發現光壓線通過門檻並不夠，文字與圖示常常看起來像停用狀態、不夠醒目。新系統的核心做法，是把顏色當作用目標對比比值生成出來，而不是先挑一個顏色再事後測。最終，每個顏色都拆成 14 級深淺，依用途分別對應文字、圖示、按鈕背景、邊框與焦點狀態各自需要的那一級。
深淺變化要保留色相，不能只靠亮度硬調
直接調整明度容易讓色階裡的深淺版本看起來不像同一支顏色。常見的 HSL 色彩模型均分明度時，人眼對不同色相的感知並不均勻，某些色相在變淺或變深時會明顯偏向另一個色相，等於做出一組同源但不同色的色階，反而稀釋掉品牌辨識度。
Adobe 團隊原本也用 HSL 均分色相，好懂也好操作，但隨著色彩需求越來越複雜，他們想替色彩決策找一套更科學的做法，改用感知均勻的色彩空間 CAM02 來產生深淺變體。這麼一來，色階裡每一級在人眼看來都還認得出是同一支品牌色的家族，同時能精準控制它要達到的對比比值，不是憑感覺調深一點的做法。
內文和按鈕文字，鎖定能跨過 4.5:1 的那個色階
這一級色階要怎麼挑，目標不是選一個大概比較深的顏色，而是直接設定它對實際會出現的背景要達到的對比比值，例如 4.5:1，再反推出符合這個比值的實際色號。Adobe 用開源工具 Leonardo 做的正是這件事，讓設計師先決定某個顏色對某個底色要達到多少對比比值，工具再反推出對應的色號，而不是先挑一個顏色再事後拿去測。
這一級色階專門給內文文字、連結文字、按鈕上的文字、表單錯誤訊息文字這些文字類用途使用，因為文字的門檻統一是 4.5:1（大字級可以放寬到 3:1，但不建議為了套用原色而刻意放大字級去規避門檻，那是繞過規則，不是解決問題）。
邊框、圖示、焦點框只要跨過 3:1 即合格
這一級門檻之所以比文字低，是因為它服務的是 UI 元件的可視邊界與狀態指示，像按鈕外框、輸入框邊框、切換開關、焦點框，而不是需要被逐字讀出來的文字。WCAG 對這類非文字視覺資訊訂的門檻是 3:1，而且量的是相鄰色：元件和它旁邊、外部背景之間的對比，不是元件內部兩種顏色互相比較，例如輸入框內部背景是白色、外部背景是深色，要比對的是元件跟外部背景之間的對比，不是元件內部的邊框顏色。
這一級色階通常會比文字用的那級淺，飽和度也更接近原始品牌色，設計上的犧牲感因此比文字色階小。停用狀態的元件不在此限，不需要符合這道門檻。
每一組實際會出現的配色都要單獨測過
測試環節最容易被忽略的地方，是很多團隊只測過品牌色對純白或對純黑這一組，就以為整套色階都合格了。但實際畫面上文字不會永遠出現在純白背景上，卡片底色、hover 狀態背景、半透明遮罩、疊在圖片上的文字，都會改變它實際相鄰的顏色。
真正該做的是把這一級色階會出現的每一種背景組合都個別測過，建立一個文字色與背景色的對照矩陣，任何一格測出來低於門檻就是要修正的地方。而且這件事不是做一次就結束，色階或背景色只要有一處調整，連帶受影響的組合都要重新測過，因為對比是兩個顏色的相對關係，單獨看其中一個顏色達不達標沒有意義。
色階要變成團隊共用的資產，不是設計師各自記的偏好
色階做出來之後，如果只有設計師自己知道這個深一點的版本可以用在文字上，團隊裡其他人，像另一位設計師、負責切版的工程師、之後接手的人，就無從得知，久了大家還是會各自憑印象挑色號，等於繞回問題原點。
解法是把測過關的配對寫下來，變成團隊共用的東西，不管是一份簡單文件，記錄哪個色號對哪個背景可以用在文字上、哪個色號可以用在邊框上，還是做成設計系統裡的色彩變數，重點是核准過的配對變成大家查得到、不用每次重新猜的資產，而不是留在某個人的記憶裡。Adobe 面對 100 多個產品團隊各自摸索用色的情況，選擇的做法是保留彈性，同時把整套規則寫進文件與工具當防護，幫每個團隊都能做出符合無障礙的用色選擇，而不是留給每個團隊各自判斷。這套色階跟它背後的規則一樣，需要持續維護，不是做完一次就結束的任務。
品牌主色過不了對比檢查，從來不是要在識別度跟可讀性之間選一邊。癥結往往不是顏色本身，而是團隊有沒有把它拆成一組分工清楚的色階，讓文字、按鈕、邊框各自落在過得了關的那一格，同時讓原色繼續守住 logo 與裝飾的位置。這套色階做好、測過、寫下來之後，品牌色反而比原本更耐用，不會因為換一個場景、換一種背景就重新出問題。