Ninna UI combines the best of accessibility, performance, and developer experience into one cohesive design system.
Pure CSS custom properties mean full theming with a single import. No ThemeProvider, no hydration cost, no layout shift.
Every color token is tested for WCAG AA contrast ratios via oklch perceptual color space. Accessible out of the box.
Default, Ocean, Sunset, Forest, and Minimal — each fully customizable via CSS custom properties. Switch with one line.
12 scoped npm packages. Import only what you use. Your bundle includes only the components your app actually renders.
Every interactive component is built on Radix UI with full WAI-ARIA support, keyboard navigation, and focus management.
Built from the ground up for Tailwind v4. CSS-first config, @theme directive, @source safelisting — no config file needed.
Works with Vite, Next.js App Router, React Router v7, and any React-based framework. Full SSR and RSC compatible.
A comprehensive library covering layout, forms, data display, navigation, overlays, and feedback — all in one design system.
npx create-ninna-app generates a fully configured project with your chosen framework, theme, and TypeScript setup in seconds.