這是 示意 Demo — 換皮測試站——驗證骨架零改動可出第二個品牌。
工程資源

Design TokensNEW

品牌色彩與樣式的「單一真相來源」。資訊單位、外包廠商、系統開發商引用這份檔案,做出來的東西顏色永遠是對的——品牌一更新,重新下載即同步。

下載格式

三種格式由同一份原始檔自動產出,數值保證一致。

🧩
CSS 變數
網站/系統前端直接引用
🔗
JSON(DTCG 標準格式)
App、設計工具、跨平台整合
🌀
Tailwind Preset
Tailwind CSS 專案一行接入

色彩 tokens 一覽

變數名稱與 CSS 檔一致,前端以 var(--名稱) 引用。

變數名稱色值說明
--color-brand-primary #0B5FA5 測試藍(主色)
--color-brand-primary-dark #083F6E
--color-brand-secondary #062F52 深海藍(輔色)· 2026-07-03 補齊,值取自首頁比稿皮B定義
--color-brand-tertiary #6FA3CF 淺藍(輔色)· 2026-07-03 補齊,值取自首頁比稿皮B定義
--color-brand-accent #F2A900 測試黃(點綴)
--color-text-default #3F3B37 內文墨色(產品層暖石墨,與 mackay-mmu 同值=素顏原則)
--color-text-muted #79716B
--color-text-on-primary #FFFFFF
--color-surface-page #FAF9F7 暖石墨紙白(產品層中性色)
--color-surface-card #FFFFFF
--color-surface-line #EAE8E4
--color-feedback-success #1C7A3E
已複製