Beautiful React
UI Components
A collection of accessible, customizable, and production-ready React components. Built with TypeScript, styled with Tailwind CSS.
Component Library
A comprehensive set of accessible, customizable components built for modern React applications.
Inputs
Button
Interactive button with multiple variants and sizes.
Input
Text input with validation and icon support.
Textarea
Multi-line text input with auto-resize support.
Label
Accessible form label with required indicator.
Checkbox
Accessible checkbox with indeterminate state.
Radio
Radio button group for single selection.
Switch
Toggle switch for boolean settings.
Date Picker
Calendar-based date selection component.
Select
Dropdown select with search and multi-select.
Slider
Range slider with single or dual handles.
Data Display
Charts
Bar, line, pie, and area chart components.
Graphs
Interactive data visualization graphs.
Data Table
Sortable, filterable data table with pagination.
Carousel
Image and content carousel with auto-play.
Card
Flexible container for grouping related content.
Badge
Small status indicator or label component.
Tabs
Tabbed interface for organizing content sections.
Tooltip
Contextual information on hover or focus.
Navigation
Developer-friendly API
Import, compose, and customize. Our components are designed for seamless integration.
1import { Button } from "@component-labs/ui/button";2import { Input } from "@component-labs/ui/input";3import { Checkbox } from "@component-labs/ui/checkbox";45export function LoginForm() {6 return (7 <form className="space-y-4">8 <Input9 label="Email"10 type="email"11 placeholder="you@example.com"12 />13 <Input14 label="Password"15 type="password"16 />17 <Checkbox label="Remember me" />18 <Button variant="primary" size="lg" fullWidth>19 Sign In20 </Button>21 </form>22 );23}