Core Palette 核心色票
Semantic Colors 語意色
三色分級語言：琥珀＝警示、綠＝安全、紅＝危險，永不互相借用用途。
⚠️ 警示琥珀 #D97706
✅ 安全綠 #15803D
🚫 臨界紅 #DC2626
ℹ️ 資訊藍 #0E7C86
Typography 字體規範
H1 — Manrope 800 + Noto Sans TC
三高防治從飲食開始
Stat Number — 統計數字強調
87%
規律服藥者血壓達標比例
Body — Noto Sans TC · 17px · line-height 1.7
正文全面使用 Noto Sans TC 確保中文可讀性。連結是臨床青底線樣式，永久顯示不需 hover；劑量與數據切換 IBM Plex Mono 等寬字體，避免誤讀。
Buttons 按鈕
Hover：陰影加深 + translateY(-1px)，無旋轉、無誇張動效
Icon Tags 圖示標籤
Data Cards 資料卡
🩸
收縮壓
目標控制在 130 mmHg 以下，定期居家量測記錄。
⏰
服藥時間
固定每日同一時段服用，避免自行調整劑量。
📋
回診追蹤
每 3 個月回診一次，攜帶血壓紀錄本。
Step Flow 步驟流程
1
量測前靜坐 5 分鐘
避免剛運動或喝咖啡後立即量測，數值會偏高。
3
記錄並回報醫師
連續量測 2 次取平均值，記入血壓紀錄本。
Alert Boxes 警語框
⚠️ 警示血壓連續 3 日超過 160/100 mmHg，請主動聯繫醫療團隊。
🚫 危險出現劇烈頭痛、胸痛或意識模糊，應立即就醫，不可等待回診。
✅ 安全血壓維持在 120/80 mmHg 上下屬於理想範圍，請維持現行生活習慣。
ℹ️ 資訊居家血壓計建議每年校正一次，確保量測準確度。
Infographic Demo 衛教圖示範
✅ 每日檢查洗澡後檢查足部有無傷口或紅腫
⚠️ 避免赤腳走路、過燙泡腳水
Color Reference 色彩對照表
| 色彩 | Hex | 角色 |
|---|
| 臨床青 | #0E7C86 | Primary — 標題、連結、icon 主色 |
| 石板藍 | #1E3A5F | Secondary — 深色頁首/頁尾 |
| 冷霧灰 | #EEF2F5 | 畫布底色 |
| 警示琥珀 | #D97706 | Warning — 注意事項 |
| 安全綠 | #15803D | Success — 正常範圍、建議做法 |
| 臨界紅 | #DC2626 | Danger — 危險徵兆、緊急就醫 |