Design System · Audit v1
One system.
Unmistakably yours
The single source of truth for the site's look and motion — tokens, five primitives, and the signature moves. Everything here is theme-aware; toggle light/dark in the header to see both.
Color — one warm palette
--accent-ember
The signature. Primary buttons, one hero accent per view, the U. cursor, active states.
--accent-sage
Secondary only — positive metrics, "shipped / live" states.
Accent = scarcity. If everything glows, nothing is memorable. Aim for one ember focal point per viewport.
Typography — three roles
I build intelligent systems.
Selected work
AI & GenAI Engineering
Show what I build, how I think.
Turning foundation models into production-grade products.
Start here
Spacing & radius — 4px base
Space scale
--s-1 4px
--s-2 8px
--s-3 12px
--s-4 16px
--s-6 24px
--s-8 32px
--s-12 48px
--s-16 64px
Radius
--r-sm
6px
--r-md
10px
--r-lg
14px
--r-xl
20px
Core components — five primitives
Button — 3 variants
Card — one primitive, variants
PROOF
Case studies
Project, path, focus, and blog cards are all this one component with a
different eyebrow and body.
Chip & Stat
PythonLangChainClaude APISvelteKitTypeScript
52+
Articles
$10M+
At scale
Signature moves — live
01 · Blinking U. cursor
U
02 · Diamond connective tissue
Bullets
Dividers & ticks
Loading state
03 · Magnetic arrow & underline-grow
Read the Blog 04 · One hero moment
Umesh
--dur-fast: 120ms
--dur-base: 220ms
--dur-slow: 420ms
--ease: cubic-bezier(.16,1,.3,1)