Button · variants
ui/buttonComponent library
Every interface component the starter ships with, in its variants, sizes and states. All of them follow the theme you choose.
Form controls
Input
ui/input · labelWe'll only use it to send receipts.
Input group
ui/input-groupField with validation
ui/fieldWe'll only use it to send receipts.
Textarea
ui/textareaSelect
ui/select · native-selectCheckbox, radio & switch
ui/checkbox · radio-group · switchSlider
ui/sliderVolume60%
Input OTP
ui/input-otpCalendar
ui/calendarOverlays
Dialog & alert dialog
ui/dialog · alert-dialogSheet & drawer
ui/sheet · drawerPopover, hover card & tooltip
ui/popover · hover-card · tooltipDropdown & context menu
ui/dropdown-menu · context-menuRight-click here
Command palette
ui/commandFeedback
Alert
ui/alertHeads up
You can add components to your app with a single import.
Something went wrong
We couldn't save your changes. Try again.
Toast
ui/sonnerBadge
ui/badgePrimarySecondaryOutlineDestructivePaid
Progress & spinner
ui/progress · spinnerUpload progress36%
Skeleton
ui/skeletonEmpty state
ui/emptyNo projects yet
Create your first project to see it here.
Data
Card
ui/cardAvatar
ui/avatarLFKAPRTS
LFKAPRTS
Table
ui/table| Invoice | Status | Method | Amount |
|---|---|---|---|
| INV-001 | Paid | Card | $250.00 |
| INV-002 | Pending | Transfer | $150.00 |
| INV-003 | Unpaid | Card | $350.00 |
Chart
ui/chartItem
ui/itemRoles and permissions
Give guests view-only access and keep drafts private until you're ready.
Kbd & separator
ui/kbd · separatorPress to search⌘K
ProfileBillingSettings
Carousel
ui/carouselSlide 1
Slide 2
Slide 3
Slide 4
Layout
Resizable panels
ui/resizableProjects
Your content goes here
Scroll area
ui/scroll-areaAspect ratio
ui/aspect-ratio