← All work

Internal███████·NDA

2026 — present · Design lead + co-engineered

design system.

The shared language every surface inherits before it asks the user anything.

Design systemTokensRadixMobile peersVersioned releases

Design System

Three tiers, one foundation.

Animated icons

motion · atomic

+

Enhanced

opinionated · batteries-included

InputToastSideNavDashboardTemplateSelector

Primitives

Radix-backed · composable

ButtonSelectDialogTableDateRangePickerSelectBarCounter

Foundation

Radix UI

Primitives

22

Subpath exports

4

the kit — three tiers, one foundation.

01Premise

consistency-by-convention had failed.

Each surface owned its own buttons, selects, date pickers — drifting visually and behaviorally. Same component, three implementations, three sets of bugs, three accessibility regressions. Centralizing was the only way to make a11y, dark mode, and keyboard parity defaults instead of patches.

Built on Radix, owned by design.

The thesis

02Build

tokens before components.

A Tailwind preset shipped before any component — tokens are the contract. Then a three-tier API: primitives (Radix-backed, bring-your-own-state), enhanced (opinionated, batteries-included), and animated icons. Each tier is its own subpath export so apps tree-shake what they don't use.

03Constraint

stability vs. velocity.

Lock tokens early and slow API stabilization, or ship and pay the standardization tax in patches later. I shipped. The recent release history is the receipt — a stretch of commits aligning trigger heights, paddings, and corner radii across components. The system is now mature enough that “doesn't match the other components” is treated as a defect. That's the moment a component library becomes a design system.

Date range

Apr 24 – Apr 27

Draft

Start

Apr 24
──:──

End

Apr 27
──:──

April 2026

Mo

Tu

We

Th

Fr

Sa

Su

30
31
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
1
2
3

Times stay blank until you set them.

ClearApply

the picker — blank means blank.

04 — Stack

the kit.

  • FoundationRadix UI primitives · accessibility inherited
  • TokensTailwind preset · CSS variables · light + dark
  • TiersPrimitives · enhanced · animated icons · hooks
  • DistributionSubpath exports for tree-shaking
  • VersioningChangesets · automated GitHub Actions releases
  • DocsNextra · live demos per component

Gated · NDA

More on the design system.

Drop your email — I'll send you a one-tap link to unlock the deeper sections (role notes, more on the proudest call, what I'd redo). No account, no password.

Next — 01

hawa.

A personal finance app that talks back.

Read the case study
sherwinlove — Design × Engineering