Nexus Design System
Component library and design system powering 12+ internal applications. 200+ components with full accessibility compliance and theme support.
Nexus started as a shared Button component and grew into a full design system used across 12 internal products. The library contains 200+ components, from primitive atoms (Button, Input, Badge) to complex organisms (DataTable, CommandPalette, DateRangePicker).
Every component is built on Radix UI primitives for accessibility. We don't reinvent focus management, keyboard navigation, or ARIA patterns — Radix handles the hard parts, and we layer our visual design on top with Tailwind CSS.
The theming system supports light mode, dark mode, and custom brand themes. Themes are defined as CSS custom property sets, and components reference tokens instead of hardcoded colors. Switching themes is a single className change on the root element.
Storybook serves as both documentation and visual testing. Every component has stories covering all variants, states, and edge cases. We run Chromatic for visual regression testing — if a component's appearance changes unexpectedly, the PR gets flagged.
The biggest lesson: design systems are products. They need versioning, changelogs, migration guides, and dedicated support. Treating it as 'just a component library' leads to adoption problems and fragmentation.