Design system for React

Coherent product UI, from tokens to patterns.

SpryInnovation ties design tokens, theming, and components together so teams ship consistent interfaces without reinventing the stack.

Install

pnpm add @spry/theme @spry/ui @spry/patterns

4 packages · A11y-first · RSC-aware

Standards

Six commitments for serious product UI.

The same bar teams use when evaluating modern React libraries — maintenance, stack, accessibility, theming, performance, and design-system fit.

Read philosophy & standards

Maintenance & support

Versioned monorepo packages with clear boundaries so the stack can evolve without stalling.

Modern stack

TypeScript, React 18+, and explicit client boundaries for Next.js App Router and RSC.

Accessibility

WAI-ARIA–aligned primitives and WCAG-oriented focus and keyboard patterns.

Theming

Semantic CSS variables, light/dark, density, and createSpryTheme without forking components.

Performance

Tree-shakeable packages and tokens as variables for real dashboard and form workloads.

Design workflows

Docs, patterns, and recipes so code and tokens stay the handoff contract.

Next steps

Curated entry points