Skip to main content

Introduction

NUI is a lightweight React UI component library compatible with all React-based frameworks, including Next.js.

It provides low-level, production-ready UI primitives designed for performance, accessibility, and long-term maintainability. The library focuses on composability over rigid configuration, allowing teams to build scalable design systems on top of stable foundations.

Who is this for?​

NUI is designed for:

  • Product teams building scalable React applications
  • Engineers working on data-heavy dashboards and complex interfaces
  • Teams that prefer full control over styling and behavior
  • Organizations that value performance and accessibility by default

Design Philosophy​

The library is built around a small set of core principles:

  • Performance-first: Minimal runtime overhead and optimized rendering.
  • Composable APIs: Primitives that can be combined freely.
  • Minimal abstractions: No hidden logic or opinionated workflows.
  • Styling control: Visual decisions remain with the consumer.
  • Accessibility-aware: Sensible defaults with escape hatches when needed.

What this library is​

  • A collection of reusable UI primitives
  • A foundation for custom design systems
  • A performance-conscious alternative to heavy UI frameworks

What this library is not​

  • A full design system with fixed visual identity
  • A low-code or configuration-heavy UI builder
  • A replacement for application-level state management

Framework Compatibility​

NUI works with all React-based environments, including:

  • Next.js (App Router & Pages Router)
  • Vite
  • Create React App
  • Custom React and SSR setups

All components are compatible with server-side rendering when used according to React framework guidelines.

Production Readiness​

  • TypeScript-first with built-in typings
  • Tree-shakable ES modules
  • Server-side rendering safe
  • Designed for long-term maintenance and enterprise use

Next Steps​

  • Continue to the Getting Started guide for installation and setup
  • Explore individual component documentation
  • Review accessibility and theming guides