Core Palette 核心色板
Typography 字體樣張
H1 — Germania One + Noto Sans TC · 32px
Feel It Click 按下去有回饋
H2 · 24px
Control Panel 控制面板
H3 — Roboto Bold · 20px
每個按鈕都該看起來能按下去
Body — Roboto · 16px · line-height 1.65
正文使用 Roboto 保持清晰易讀，標題才用 Germania One 的鑄鐵質感。連結為熾焰橙，hover 轉為暖琥珀並加底線。
Buttons 按鈕
預設為 raised 雙陰影，:active 時陰影翻轉成 inset，內容下沉 2px
Tactile Control Panel 觸感控制面板
旋鈕、撥動開關、LED 指示燈 — 系統的招牌元件，光源一律取左上角
Tags & Badges 標籤
主要
次要
成功
危險
Device Cards 裝置卡片
Amplifier 擴大機
外層陶土灰機殼、內層瓷面白凹陷面板 — 材質層級一眼可辨。
Mixer 混音台
卡片不會「浮起來」，而是嵌在自己的機殼裡，如同真實裝置。
Color Reference 色彩對照
| 色彩 | Hex | 角色 |
|---|
| 熾焰橙 | #FA3C00 | Primary — 主要動作 |
| 暖琥珀 | #F08321 | Secondary — 次要動作 |
| 陶土灰 | #E7E1D4 | 機殼／面板材質 |
| 磨砂銀 | #C7C2B4 | 旋鈕、次要材質 |
| 炭墨黑 | #111827 | 文字 |
| 成功綠 | #16A34A | Semantic — LED on 狀態 |
| 危險紅 | #DC2626 | Semantic — 錯誤、危險動作 |