shadcn/ui
ui.shadcn.comEditable React components styled with Tailwind CSS, with Base UI, Radix UI, and React Aria implementations.
Setup
shadcn/ui publishes the current install commands and prerequisites in its own docs, so this page only points at them.
Read the official shadcn/ui docs for prerequisites, installation, and current APIs.
Component previews
Each component rendered by Col in a use-case scene. Your project's theme will differ; open a preview to see it in your own tokens.
Badge · Marketing Sites
Button · Landing Pages
Card · Dashboards
Checkbox · Rapid Prototyping
Dropdown Menu · Landing Pages
Input · Rapid Prototyping
Separator · Rapid Prototyping
Sheet · Rapid Prototyping
Skeleton · Dashboards
Tabs · Dashboards
Toggle Group · Rapid Prototyping
Tooltip · Marketing Sites
Field · Rapid Prototyping
Button Group · Rapid Prototyping
Input Group · Rapid Prototyping
Input OTP · Rapid Prototyping
Textarea · Rapid Prototyping
Radio Group · Rapid Prototyping
Select · Rapid Prototyping
Native Select · Rapid Prototyping
Switch · Dashboards
Slider · Dashboards
Calendar · Dashboards
Date Picker · Rapid Prototyping
Combobox · Rapid Prototyping
Label · Rapid Prototyping
Accordion · Landing Pages
Breadcrumb · Dashboards
Navigation Menu · Marketing Sites
Sidebar · Dashboards
Scroll Area · Dashboards
Resizable · Dashboards
Dialog · Rapid Prototyping
Alert Dialog · Rapid Prototyping
Drawer · Rapid Prototyping
Popover · Rapid Prototyping
Hover Card · Marketing Sites
Context Menu · Dashboards
Menubar · Dashboards
Command · Rapid Prototyping
Alert · Dashboards
Toast · Rapid Prototyping
Sonner · Rapid Prototyping
Progress · Dashboards
Spinner · Rapid Prototyping
Empty · Dashboards
Avatar · Dashboards
Table · Dashboards
Data Table · Dashboards
Chart · Dashboards
Carousel · Marketing Sites
Aspect Ratio · Marketing Sites
Typeset · Landing Pages
Item · Dashboards
Kbd · Rapid Prototyping
Collapsible · Rapid Prototyping
Toggle · Rapid Prototyping
Pagination · Dashboards
Direction · Rapid Prototyping
Attachment · Rapid Prototyping
Bubble · Rapid Prototyping
Marker · Rapid Prototyping
Message · Rapid Prototyping
Message Scroller · Rapid Prototyping
Questionnaire · Rapid Prototyping
Agent setup prompt
Send your agent to the current official docs.
Read the current official docs / llms.txt at https://ui.shadcn.com/docs, then install from there. Use shadcn/ui in this existing project and follow those setup pages step by step: Col publishes no install commands of its own, so take every command, prerequisite, and version from them and cite the pages you used. Keep the project's existing conventions, preserve accessibility, and report anything the official docs do not cover.