✨ UX-DECK UNIFIED DESIGN SYSTEM

跨專案設計調性、風格與字體總覽

以極簡白底(White Basis)為視覺根基,結合十二個兄弟端點的精準品牌色調、雙軌圖標體系(Modern Emblem 宏觀品牌紋章 × Lucide 微觀介面線性)與人文/科技專屬字體排版。
🐾 1. 十三隻專案象徵幾何吉祥物 (Settled Geometric Mascots)
🎨 檢視 27 隻動物三大風格(Lucide 線性 · Modern Emblem 徽章 · Kawaii Chibi 萌寵)全圖鑑 ↗
落實「宏觀品牌紋章 + 微觀介面線性」雙軌圖標識別:點擊勳章或線性圖示可直接檢視純向量 SVG 檔案;每張專案卡片下方均提供「🎨 Showcase 設計展示、📦 Repo 原始碼庫、🌐 Live 正式站點(具備獨立實體者另含 🚀 Pages 靜態站)」直達導航。
🏛️ Modern Emblem 官方紋章 × ⚡ Lucide 介面線性:雙軌圖標設計架構
DUAL-TIER SYSTEM
🏛️ 宏觀品牌層 (Macro Brand) 80px ~ 160px · 多色向量徽記
Modern Emblem 現代商標徽章
富含層次、品牌字標與背景盾牌。專注於專案首頁 Hero 封面、GitHub README 頂部門面、About 系統關於彈窗與研報官方覆蓋印鑑,奠定獨立專案格局。
⚡ 微觀介面層 (Micro UI) 16px ~ 24px · 2px 單色線條
Lucide 極簡幾何線性圖標
零干擾高密度呈現。專注於導航欄切換、表格狀態指示、篩選 Chip、按鈕圖標與側邊欄,確保毫秒級秒懂、高頻操作不疲勞。
幾何林鹿 🦌
mkdocs-life (生活日誌)
宏觀以王者雄鹿立姿作為官方紋章門面;微觀以 24px 極簡對稱鹿角作為高密度導航與狀態線性圖標。
破曉警報鳥 🐦
GoogleAlertManager (SaaS)
宏觀以破曉知更旭日圓盤作為系統門面;微觀以圓滾高翹尾飛鳥作為情報雷達與通報 Chip 線性標誌。
聲波座頭鯨 🐋
YoutubeAudio.Fetch (影音 Podcast 萃取)
宏觀以深海翻騰水花躍鯨作為播放器封面;微觀以聲波噴泉座頭鯨作為聲學控制與音軌切換指示。
貨櫃藍鯨 (Container Blue Whale) 🐳
Docker-Deck (Docker 映像目錄)
宏觀以 Docker 藍鯨承載貨櫃作為品牌紋章;微觀以貨櫃藍鯨線性圖標連結映像探索與容器啟動。
幾何狂牛 🐂
mkdocs-investment (多頭攻堅)
宏觀以沖天雙角赤陶狂牛盾牌作為多頭主頁門面;微觀以幾何牛角線條作為多頭突破與持股評等符號。
北歐守護熊 🐻
mkdocs-investment (防禦避險)
宏觀以冬眠防禦步態巨熊作為下檔風險護盾;微觀以圓耳線性熊頭標示空頭對沖與保守配置。
客廳小管家 柴柴 🐕
HomeAssistant (Android TV)
宏觀以忠誠巡守柴柴作為電視客廳情境總覽封面;微觀以豎耳線性犬首標記智慧家庭通知與即時監控。
敏捷守護貓 🐱
wenchiehlee.quickconnect.to (Synology NAS)
宏觀以幾何守護者之姿作為私有雲系統門面;微觀以三角耳幾何貓首標示 Docker 容器、Tailscale 與連線狀態。
拍拍翅萌萌鴞 🦉
My-TW-Coverage (台股個股覆蓋)
宏觀以治癒系萌鴞作為個股研報官方認證印鑑;微觀以大眼線性貓頭鷹作為研究評等與安全邊際欄位圖標。
領航雄鷹 🦅
InvestorConference (法人說明會與 IR 庫)
宏觀以展翅高飛的綠色領航雄鷹紋章作為法說會資料庫門面;微觀以銳利幾何鷹影作為重要事件與高階展望標籤。
幾何黑天鵝 🦢
VIX (全球波動率與黑天鵝雷達)
宏觀以幾何黑天鵝極端風險徽章作為雷達封面;微觀以高對比曜石天鵝作為市場恐慌 30 閾值與壓力測試標記。
採集松鼠 🐿️
Synology-Photo-Tagger (相片智慧標籤)
宏觀以抱握松果的靈巧松鼠作為相片資產徽章;微觀以大尾線性松鼠標記 AI 物件辨識、場景分類與 EXIF/XMP 智慧標籤入庫。
敏捷白兔 (Agile Rabbit) 🐇
Skill-Deck (共享技能登錄庫)
宏觀以跑酷凌空飛躍的敏捷白兔紋章呈現技能探索的品牌入口;微觀以跑酷疾速白兔線性圖標標示搜尋、分類與技能瀏覽功能。
🎨 2. 專案色彩、字體與介面展示 (Color, Typography & Live Previews)
各專案的品牌色彩、專屬字體與真實元件預覽已集中在獨立頁面;點擊上方任一「官方紋章」即可查看對應展示。
🎨 瀏覽專案展示 ↗
📐 3. 向量尺寸梯階測試 (14px ~ 64px)
驗證十三個端點吉祥物自桌面小圖示 (14px) 至客廳電視大螢幕 (64px) 之邊角清晰度與筆畫比例。
14px (xs)
18px (sm)
24px (md 預設)
32px (lg)
48px (xl)
48px (敏捷守護貓)
48px (研究貓頭鷹)
48px (領航雄鷹)
48px (幾何黑天鵝)
48px (採集松鼠)
48px (敏捷白兔)
48px (貨櫃藍鯨)
64px (tv 10英呎)