Shadcn UI Components
Reference docs for the shadcn/ui components used across every ShadcnStore block. ShadcnStore docs and blocks target Base UI (base-nova). Each page covers installation, variants, props, accessibility, and copy-paste examples, and links to the real blocks that use the component so you can see it in a finished layout.
New to composition (render, Accordion / Toggle Group / Select)? Read Composition with Base UI. In a hurry? The cheatsheet lists every component with its install command on one page.
Browse components
AccordionCollapsible sections for FAQs and details.AlertInline callouts for notes, warnings, and errors.Alert DialogA confirmation modal that requires an action.Aspect RatioKeep media locked to a fixed ratio.AvatarUser images with an initials fallback.BadgeCompact labels for status, counts, and tags.BreadcrumbA navigation trail to the current page.ButtonActions, links, variants, sizes, and loading states.Button GroupJoin related buttons into one control.CalendarInline single, range, and multiple date selection.CardA grouped-content container with header and footer.CarouselA swipeable slider for images and cards.ChartThemed Recharts visualizations driven by config.CheckboxBoolean choices for forms and filters.CollapsibleToggle one region open and closed.ComboboxSearchable autocomplete single-select.CommandA searchable command palette with shortcuts.Context MenuRight-click actions on an element.Data TableSortable, filterable, paginated tables.Date PickerA compact popover calendar input.DialogModal overlays for confirmations and forms.DrawerA draggable bottom sheet for mobile.Dropdown MenuAction menus, row actions, and overflow menus.EmptyAn empty-state layout with an action.FieldLabels, descriptions, and errors for controls.FormAccessible validation patterns for React forms.Hover CardA rich preview revealed on hover or focus.InputText fields with labels, types, and validation.Input GroupInputs with leading and trailing addons.Input OTPA one-time-password field with slots.ItemA list-row layout with media, text, and actions.KbdKeyboard shortcut keys and combinations.LabelAccessible names for form controls.MarkerInline conversation status, notes, and separators.MenubarA desktop-style application menu bar.MessageA chat turn with avatar, content, and footer.Message ScrollerA streaming chat scroll container with turn anchoring.Native SelectA styled native dropdown control.Navigation MenuPrimary navigation with expandable panels.PaginationPage navigation for lists and tables.PopoverRich floating content anchored to a trigger.ProgressA determinate progress bar for steps and uploads.Radio GroupOne visible choice from a set.ResizableDraggable resizable panel layouts.Scroll AreaA styled, cross-browser scroll container.SelectChoose one option from a list.SeparatorA horizontal or vertical divider.SheetA slide-in panel for navigation and filters.SidebarA collapsible application navigation panel.SkeletonAnimated loading placeholders.SliderPick a value or range by dragging.SpinnerAn indeterminate loading indicator.SwitchAn immediate on/off setting.TableA styled, semantic table primitive.TabsSwitch between related panels.TextareaA multi-line text input.Toast (Sonner)Non-blocking notification messages.ToggleA two-state button for formatting and views.Toggle GroupA set of related toggle buttons.TooltipA short hint on hover or focus.TypographyHeading, prose, and inline-text patterns.
Related
- Installation: set up shadcn/ui and the ShadcnStore registry.
- Theming: customize colors and design tokens.
- Browse all blocks: components composed into full sections.