Getting Started
Learn how to install and use Enara Design System in your project.
Components
Explore production-ready React components with live examples.
Design Tokens
Understand the visual language powering consistent interfaces.
Design Language
Discover our principles, colors, and typography guidelines.
Why Enara Design System?
Token-First Architecture
Built on 304+ design tokens for consistent spacing, colors, typography, and motion across all components.
React Components
Vanilla React components with TypeScript, CSS Modules, and type-safe variants using CVA.
AI-Ready Metadata
Every component includes structured metadata for AI-powered component selection and composition.
Accessibility First
WCAG AA compliant with proper ARIA attributes, keyboard navigation, and focus management.
Zero Runtime Overhead
CSS Modules provide zero-runtime styling. No CSS-in-JS performance penalty.
Atomic Design
Components organized by atomic design principles: atoms, molecules, and organisms.