Nexus: one language for five enterprise products

The suite had grown organically for five years. There were 14 shades of blue, six different date pickers and inconsistent button behavior. Developers spent around 40% of their time rebuilding UI that already existed somewhere else.

The aim was a language, not a sticker sheet. It started with design tokens:

• Primitive tokens hold raw values, like blue-500 or gray-100.
• Semantic tokens hold intent, like color-action-primary or bg-surface-subtle.

That semantic layer paid off quickly: dark mode shipped across five products in two weeks by remapping tokens instead of rewriting CSS.

I built 40+ components in Figma with auto layout and variants, but the real value was in code. Working closely with engineering, every component was accessible by default.

For example, the Input component associates its label automatically, and handles errors with aria-invalid and aria-describedby, so teams get it right without thinking about it.

A design system fails if nobody uses it. A federated contribution model kept it alive:

• Office hours each week, where designers could propose new patterns.
• Decision logs recording why a pattern was chosen, to stop circular debates.

• Velocity: front-end development time fell 35%.
• Adoption: 100% of new feature work used Nexus within six months.
• Quality: accessibility defects in QA dropped 80%.