Primitives
Headless, unstyled components that provide behavior, accessibility, and state management. Style them however you want with complete control.
What are Primitives?
Primitives are headless components that handle all the complex behavior, keyboard navigation, accessibility, and state management while providing zero styling. They give you complete control to build exactly what you need.
Fully Accessible
WCAG 2.1 AA compliant with full keyboard navigation and screen reader support
Completely Unstyled
No CSS, no opinions. Apply your own design system and styling
Composable
Build complex components by composing simple primitives together
Available Primitives
Click on any primitive to view demos, API documentation, and code examples.
Accordion
Vertically stacked sections of content that can be expanded or collapsed
Checkbox
Binary selection control with indeterminate state support
Collapsible
Expandable content area with trigger control
Dialog
Modal window with overlay, focus trap, and escape handling
Dropdown Menu
Menu with items, keyboard navigation, and positioning
Hover Card
Rich content preview on hover with configurable delays
Label
Accessible label element with automatic input association
Popover
Floating content panel anchored to a trigger element
Radio Group
Mutually exclusive selection with arrow key navigation
Select
Dropdown selection menu with keyboard navigation and search
Sheet
Side panel that slides in from edge of viewport with overlay
Switch
Toggle control for binary on/off states
Table WIP
Data table with sorting, pagination, and selection (Phase 1-2 complete)
Tabs
Tabbed interface with keyboard navigation and orientation support
Tooltip
Brief informational popup on hover or focus with positioning
Why Use Primitives?
Perfect For:
- ✓ Building custom design systems from scratch
- ✓ Implementing unique brand-specific designs
- ✓ Using your own CSS framework or methodology
- ✓ Maximum flexibility and control over appearance
Need Styled Components?
If you want pre-styled components with beautiful defaults based on shadcn/ui design, check out our styled components. They're built on top of these same primitives.
View Styled Components →