LaunchApp
Release1 min read

Design System v2: 104 components, --la-* tokens, dark mode

The second major version of our shared Radix UI + Tailwind CSS 4 design system ships with a complete token overhaul, dark mode polish, and 104 production-ready components.

Design System v2 is here. After months of work, we're shipping 104 components, a complete token overhaul with the new --la-* design token namespace, and polished dark mode support across the entire component library.

What's changed

The biggest change is the token system. We've moved from generic color names to a structured --la-* token namespace that maps to semantic roles: --la-primary, --la-accent, --la-success, --la-muted, and so on. This makes it trivial to theme any component without touching its source.

All colors are now defined in OKLch color space, which gives us perceptually uniform color ramps and better dark mode contrast ratios than the previous HSL approach.

Dark mode is now a first-class concern. Every component ships with dark mode styles baked in, not bolted on. The theming system respects the user's OS preference by default and lets users override with a theme toggle.

New components

We added 36 new components since v1: data tables, calendar pickers, toast notification systems, drag-and-drop file uploaders, multi-step form wizards, and more.

Migration from v1

The migration from v1 is straightforward for most projects. The main breaking change is the token namespace shift. We've provided a codemod that handles the most common renames automatically.

Check the migration guide in the design-system repo for the full list of breaking changes and the codemod instructions.

Want to follow along? Browse all posts or follow @launchappdev on X.