抄自己的色票，結果抄到三個不合格的值

#那時候在想什麼

部落格要跟 super-reversi2 同一個調性，最省事的做法就是把它的色票整組搬過來。那個專案有兩套主題，暗色墨底跟宣紙亮底。部落格是長文閱讀，選宣紙。

.theme-paper 那組變數直接抄：

--bg: #e7dcc3;      --card: #f2ead6;   --card-elev: #e6d9bc;
--text: #2a2118;    --dim: #6e6046;
--accent: #1f6e58;  --gold: #8a6a2f;   --red: #a83226;

#實際做了什麼

抄之前先算一次對比度。三種紙面乘上每一顆前景色，實際跑 WCAG 的相對亮度公式，不用眼睛判斷。

                       card   elev     bg
text #2a2118           13.18  11.30  11.60
dim #6e6046             5.11   4.38   4.50   不過
jade #1f6e58            5.11   4.38   4.50   不過
bronze #6b5220          6.14   5.26   5.41
cinnabar #a83226        5.56   4.77   4.90
gold #8a6a2f            4.19   3.59   3.69   文字不過，框線過
goldbright #a5813a      3.02   2.59   2.66   全不過

--dim 跟玉青對 --card-elev 只有 4.38，AA 要 4.5。

有意思的是這兩顆在原專案裡是合格的，因為在那邊它們只出現在 --card 上，那面是 5.11。部落格不一樣，次要文字會落在程式碼區塊旁邊、時間軸的列上，那些底是 --card-elev。同一顆顏色換個位置就不合格了。

兩顆各壓深一階。--dim 從 #6e6046 改成 #665941，三面是 4.89 / 5.02 / 5.70。玉青當文字時改用 --accent-text: #1c6350，三面是 5.09 / 5.23 / 5.94，--accent 保留原值只當填色跟框線。

改完之後才發現還有第三顆。徽章有自己的淡染底，硃砂那級的 8% 淡染疊在 card-elev 上會把底色一起拉紅，#a83226 對它只剩 4.27。這個是把整組跑進自動檢查之後才抓到的，眼睛完全看不出來。改成 #96291e，三面 5.11 到 5.93。

順便還抓到 --line-gold（#9c7c40）對 elev 跟 bg 只有 2.80 跟 2.87，連非文字的 3:1 都不到。它在這裡是引言塊的左側標記線，看不清楚就失去作用，改成 #907038。

#試過但沒留下

想過整組不動，靠「別把次要文字放在 elev 上」這條規則來閃。

放棄了。那種規則寫在註解裡沒人記得，而且它會隨著版面演化自己失效。今天沒放，明天加一個新元件就放了。與其立一條要靠記憶維持的規則，不如把顏色改對。

後來乾脆寫了一支檢查程式掛進 CI，讀 tokens.css 把每一顆文字色對三種紙面（加上徽章自己的淡染底）全部實算一遍，不過就讓建置失敗。四十二項檢查，前面講的三顆全是它抓到的。

#結論

金色的部分沿用原專案已經踩過的坑。--gold 只當框線，4.19 過得了非文字的 3:1；金色文字一律用 --gold-text: #6b5220。--gold-bright 在宣紙上是 3.02，整個不用，檢查程式會擋。

這條 super-reversi2 的 menu.css 裡有整段註解記著，當時是為了客棧卡的次級按鈕。同一個坑不用踩第二次。

框架部分留下來的是 .panel-ornate 的雙背景漸層金框跟硃砂印章字，兩個都是純 CSS，沒有貼圖。原專案宣紙主題用的是 9-slice 的捲軸框景圖（frame-scroll.webp，165 KB），部落格用不上那個重量。