Components
A comprehensive collection of reusable UI components built with React and Tailwind CSS. Each component is designed to be accessible, customizable, and easy to use.
4 components
Layout
Components for structuring your application layout
5 components
Navigation
Components for user navigation and wayfinding
8 components
Input
Form controls and user input components
7 components
Display
Components for displaying content and data
5 components
Feedback
Components for user feedback and system status
4 components
Overlay
Modal dialogs, popovers, and overlays
3 components
Data Display
Tables, lists, and data visualization
Component Philosophy
Every NH-UI component is built with these principles in mind:
- Accessible by Default: All components meet WCAG 2.1 AA standards
- Fully Typed: Complete TypeScript support with IntelliSense
- Customizable: Tailwind utilities and CSS variables for easy theming
- Tree-shakeable: Import only what you need for optimal bundle size
- Dark Mode Ready: Beautiful in both light and dark themes
- Mobile First: Responsive design that works on all devices
Getting Started
To start using NH-UI components in your project:
npm install @noiseheroes/ui
// Import components in your React app
import { NHButton, NHCard } from '@noiseheroes/ui';