Component Library

Browse, preview, and copy components

Component Library

A comprehensive collection of shadcn/ui components with interactive previews, copy-paste code, and full documentation.

75+
Total Components
11
Categories
150+
Code Examples
All
Interactive Previews

Categories

Forms
Input fields, checkboxes, radios, selects, and more form elements.

Components:

Button, Input, Checkbox, Radio, Select, Textarea, Switch, Slider, Rating, FileUpload, ColorPicker

Explore →
Layout
Structure and organization components for page layouts.

Components:

Card, Separator, Divider, Timeline, Stepper, GridPattern

Explore →
Navigation
Navigation components for user movement through content.

Components:

Tabs, Breadcrumb, Pagination, Accordion, Collapsible

Explore →
Feedback
Components for user feedback and status information.

Components:

Badge, Alert, Progress, Skeleton, Tooltip, Spinner, LoadingDots

Explore →
Data Display
Display and present data to users.

Components:

Table, Avatar, AvatarGroup, StatsCard, StatCard

Explore →
Charts
Data visualization and chart components.

Components:

Bar Chart, Line Chart, Pie Chart, Area Chart, Radar Chart

Explore →
Overlays
Modal and floating components.

Components:

Dialog, Popover, Sheet, Dropdown Menu

Explore →
Advanced
Complex interactive components.

Components:

Calendar, Combobox, Date Picker, Kbd

Explore →
Marketing
Components for landing pages and marketing content.

Components:

PricingCard, FeatureCard, TestimonialCard

Explore →
Utilities
Helper components for common UI patterns.

Components:

EmptyState, ChatBubble, EventCard, NotificationBadge, StatusBadge

Explore →

How to Use

  1. 1Browse the component categories using the sidebar
  2. 2Click on a component to see the live preview
  3. 3Switch to the Code tab to view the implementation
  4. 4Click the copy button to copy the code snippet
  5. 5Paste it into your project and customize as needed