NuvUI MCP server

nuvui

React components for enterprise applications: the data tables, forms, charts, maps, editors and dashboards that business software is made of.

Website · Docs · Blocks · Charts · Theme builder · Changelog

Contents

• What it is
• Quick start
• Packages
• Components
• What each add-on does
• Theming
• The website
• Using it with a coding agent
• Accessibility and testing
• Support
• Status and the road to 1.0
• Working on it

What it is

• Built on Radix UI primitives, so focus, keyboard behavior and ARIA come from a tested base.
• Styled with plain CSS. One stylesheet, imported once. Nothing in the JavaScript imports CSS, so there's no loader to configure and it works with server components.
• Restyled through CSS custom properties, named after Tailwind v4's theme variables. Class names follow BEM with a nuv- prefix.
• Light and dark themes, five presets and three densities, all from design tokens that ship as CSS and as SCSS source.
• A core package and thirteen add-ons. The parts that need a library of their own, such as tables, charts and maps, are separate packages, so an app carries only what it uses.
• Tested in Chromium, Firefox and WebKit, for keyboard behavior, touch sizes and accessibility in light, dark and forced colors, with axe in every theme.

Quick start

pnpm add @nuvui/react

It needs React 18.2 or 19. @nuvui/3d needs React 19.

import "@nuvui/react/styles.css";
import { Button } from "@nuvui/react";

export default function Page() {
  return <Button intent="secondary">Save changes</Button>;
}

Dark mode is opt-in. Put data-theme="dark" on , or data-theme="system" to follow the visitor's operating system.

To restyle a component, set its CSS variables. The library doesn't declare them, so any rule of yours wins:

:root {
  --nuv-button-radius: var(--radius-full);
}

Getting started has the rest.

Packages

Each add-on is installed next to @nuvui/react, with the library it's built on where that's a peer dependency.

Shortened. The full README is on GitHub.