REACT / BASE UI / TAILWIND CSS V4
Soft by design.
Clear in use.
Raised controls, clear selection and visible focus. Build a complete interface with shared styles and source you can edit.
One interface. Not loose parts.
Edit a field, change a setting, then save.
56 results
TemplatessourceButton
The primary action control with raised, pressed, and primary states.
sourceDialog
A modal surface that safely traps focus and restores it to the original trigger.
sourceDropdown Menu
A contextual menu for keyboard navigation through actions, selections, and submenus.
sourceAlert Dialog
An explicit confirmation for an irreversible action.
sourcePopover
An anchored panel for contextual settings.
sourceHover Card
A supplemental preview of a link destination.
sourceSheet
A scrollable task panel attached to a viewport edge.
sourceContext Menu
A pointer-positioned action menu with checkbox, radio, and submenu items.
sourceDrawer
A bottom or side task panel that can be dismissed with a swipe.
sourceCheckbox
A native checkbox supporting boolean and indeterminate states.
sourceInput
An inset single-line input with clear focus and validation states.
sourceInput Group
A composable field that groups an input, addons, and actions on one inset surface.
sourceLabel
A native label that connects a form control name to its click target.
sourceRadio Group
A group of native radio inputs for selecting a single value.
sourceSelect
A native select surface that preserves browser accessibility.
sourceSlider
A range control for adjusting one or more values on a horizontal or vertical track.
sourceSwitch
An on-or-off control that presents immediately applied settings on a pressed track.
sourceTextarea
A resizable inset field for entering multiline text.
sourceToggle
A standalone button with a persistent pressed state.
sourceToggle Group
A keyboard-navigable group of single or multiple selections.
sourceField
Connect a control with its label, description, and validation errors.
sourceFieldset
Group related controls under a shared legend and disabled state.
sourceForm
A native form coordinating field validation and submission errors.
sourceNumber Field
Numeric entry with bounds, steps, and locale-aware formatting.
sourceCombobox
Searchable selection with filtering, empty results, and keyboard interaction.
sourceCalendar
A neumorphic calendar for single dates and ranges.
sourceDate Picker
Choose and clear a date in a focused popover.
sourceInput OTP
A verification-code input that combines one real input with multiple visual slots.
sourceAccordion
A disclosure group that expands one section at a time or multiple sections together.
sourceBreadcrumb
Displays the path to the current page as a meaningful ordered list.
sourcePagination
A set of raised links that identifies the current page and previous or next navigation.
sourceTabs
A tab interface for keyboard switching between panels in the same context.
sourceTooltip
A popup that provides a short supporting description on hover and keyboard focus.
sourceCollapsible
Reveal or hide one group of optional settings.
sourceToolbar
An arrow-key-navigable set of document actions.
sourceNavigation Menu
Keyboard-aware website navigation with links and floating panels.
sourceMenubar
Application command menus with roving keyboard focus.
sourceCommand
A searchable command palette and quick-navigation list with keyboard selection.
sourceCarousel
A sequential content view navigated by touch, buttons, and arrow keys.
sourceResizable
Split panels whose proportions can be adjusted with pointer or keyboard.
sourceSidebar
Application navigation with desktop collapse and a mobile Sheet.
sourceAlert
A message that communicates important status and outcomes on a raised surface.
sourceAvatar
A profile surface that preserves its fallback when an image fails to load.
sourceBadge
A concise inline label for displaying status and classification clearly.
sourceCard
A surface that groups content at raised, soft, inset, or flat depth.
sourceProgress
Progress status rendered as a primary fill inside an inset track.
sourceScroll Area
A themed overflow surface that preserves native browser scrolling.
sourceSeparator
A divider that expresses boundaries between related content with light and a fine shadow.
sourceSkeleton
An inset placeholder that previews the size and position of content while it loads.
sourceTable
A semantic data table that scrolls horizontally on smaller screens.
sourceMeter
Represent a measurement within a known range.
sourceData Table
Compose search, filters, sorting, row selection and pagination.
sourceToast
Notifications with result messages and undo actions.
sourceChart
Responsive chart surfaces, tooltips and exact-data tables.
sourceImage Card
A content card that combines an image and description on one raised surface.
sourceMarquee
A repeating information strip with pause controls and reduced-motion support.