Build faster with Nuxt UI's CSS-first design system powered by Tailwind CSS and its semantic color system combined with a runtime configuration.
CSS-first configuration
Define fonts, colors, and breakpoints with the @theme directive directly in your CSS. This makes your theme portable, maintainable and easy to customize.
Semantic color system
Configure 7 semantic color aliases (primary, secondary, success, info, warning, error, neutral) that describe the purpose of colors rather than specific values.
Runtime color configuration
Change colors, icons and more at runtime through AppConfig without rebuilding your application, perfect for multi-tenant applications or dynamic theming.