← Back to CIS Home
Design System Previews
雷蒙三十 品牌設計系統的 token 視覺參考。每張卡片獨立展示一組設計決策 — 色彩、字體、間距、陰影、元件、品牌素材。由 Claude Design 生成。
Colors
Colors — Brand
Teal · Orange · Yellow primaries
Open →
Colors — Ink
Body / strong / muted / on-dark
Open →
Colors — Semantic
Success · Warning · Danger · Info
Open →
Colors — Surface
Paper · Light · Dark · Cover
Open →
Colors — Tonal softs
Teal-soft, Orange-soft, Yellow-soft
Open →
Type
Type — Display specimen
字魂扁桃體 cover-scale demo
Open →
Type — Body + meta
Noto Sans TC 500 / Inter 600 meta
Open →
Type — Mixed script
CJK + Latin inter-run spacing
Open →
Type — Scale table
--ms-fs-cover → --ms-fs-meta
Open →
Spacing & shape
Spacing — Scale
8-px rhythm · --space-1 → --space-10
Open →
Spacing — Motion
Ease curves · fast / med / slow durations
Open →
Radii
--r-sm → --r-xl · pill
Open →
Shadows
xs · sm brand spec
Open →
Components
Components — Buttons
Primary / CTA · rectangular 8px radius
Open →
Components — Cards
Default · Accent teal · Accent orange #FF8310
Open →
Components — Pills
Tag / status / filter pill variants
Open →
Components — Quote
Serif " mark · soft grey（左邊框已禁用）
Open →
Components — Code
JetBrains Mono on #1a1a2e
Open →
Components — Site footer
Dark + beige · 品牌欄＋導覽＋版權條
Open →
Brand
Brand — Logo
Square mark placement
Open →
Brand — Grid paper
12×12 px ruled background
Open →