Design System
Yode Wang Portfolio ยท Achromatic Pulse
1. Typography
Display
Display Title
case title
H1
Page Heading
page title
H2
Section Heading
section
H3
Card Title
card / sub
Body
Body text specimen for readability.
prose
Nav
Navigation
nav / btn
Caption
OVERLINE / LABEL
metadata
2. Color
bgvar(--c-bg)
surfacevar(--c-surface)
surface-subtlevar(--c-surface-subtle)
inkvar(--c-ink)
ink-subtlevar(--c-ink-subtle)
bordervar(--c-border)
accentvar(--c-accent)
accent-dimvar(--c-accent-dim)
3. Spacing & Grid
8
16
24
32
48
64
96
8px rhythm, 32px page grid, fluid gutter, 12-column case-study layout.
4. Graphic Elements
//
5. Components
Hover Inversion
Arrow CTA
View Case Study
TOC States
DefaultHoverActive
ProseBlockquote
//
Key design insight.
7. Motion