把配色交給靈感，把細節交給你

這套配色已依「網頁設計規律」重映射：中性灰階骨架 + 主/輔色 + 語義色。

按鈕 Buttons

表單 Form

電子郵件

方案

備註

控制項 Controls

已勾選 Checkbox 已選 Radio

開關 Toggle

滑桿 Range

提示 Alerts（語義色）

✓ 成功操作已完成。

! 警告請確認後再繼續。

✕ 危險此動作無法復原。

i 資訊有新版本可用。

標籤 Badges

Primary Accent Success Warning Danger Outline

卡片 Cards

即時預覽

配色變動立刻反映。

智能重映射

依規律補出設計系統。

對比檢測

標示 WCAG AA/AAA。

表格 Table

總覽分析設定

進度 72%

A B +5 協作成員

設計系統解析／網頁

下方角色由當前配色「依場景規律重映射」產生（非原始色）；最底為原始調色盤對比。

對比比值依 WCAG：正文需 ≥ 4.5（AA）、≥ 7（AAA）；大字 ≥ 3 即 AA。重映射規律僅供參考，可在左側自行微調原始配色。