Button
Primary action trigger with variants, sizes, and icon support.
Primary action trigger with variants, sizes, and icon support.
Cluster related buttons into a single segmented control.
Single-line text field for short user input.
Input composed with adornments like icons, prefixes, and addons.
Segmented input for one-time codes and verification tokens.
Multi-line text field that grows with its content.
Boolean toggle for selecting one or more options from a set.
On/off control for immediately-applied settings.
Styled dropdown for choosing one option from a list.
Native <select> element styled to match the design system.
Searchable select with keyboard navigation and filtering.
Mutually-exclusive choice between a small set of options.
Pick a value or range along a continuous track.
OKLCH colour popover with visual hue / chroma / lightness tracks, hex field, and optional eye dropper.
Two-state button for turning a formatting option on or off.
Grouped toggles for single- or multi-select formatting.
Accessible caption associated with a form control.
Wraps a label, control, hint, and error message as one unit.
Month-grid date picker with range and multi-select modes.
User image with initials fallback and status indicators.
Compact label for statuses, counts, and tags.
Surface that groups related content with header, body, and footer.
Linear indicator for determinate task completion.
Indeterminate loading indicator for in-flight work.
Placeholder shapes that mimic content while loading.
Inline keyboard key styled for shortcut hints.
Callout banner for important, non-blocking messages.
File or image chip with metadata, upload states, and remove actions.
Empty-state layout with icon, title, body, and primary action.
Generic list row with leading, content, and trailing slots.
Themed Recharts wrapper with tokens for colors and tooltips.
Semantic table primitives for tabular data.
Switch between sibling views within the same surface.
Hierarchical trail showing the user's path through the app.
Page-navigation controls for long result sets.
Top-level navigation with animated mega-menu panels.
Desktop-style menu bar with cascading submenus.
Collapsible side navigation shell with keyboard shortcut.
Stack of collapsible sections for progressive disclosure.
Single show/hide region controlled by a trigger.
Horizontal or vertical divider between related groups.
Preserves a consistent width-to-height ratio for media.
Custom-styled, platform-consistent scrollbars.
Split panes with draggable dividers and persisted sizes.
Swipeable slideshow with keyboard and touch support.
Modal overlay for focused tasks; traps focus and frosts the page behind.
Blocking confirmation for destructive or irreversible actions.
Side panel that slides in from a screen edge.
Bottom-anchored sheet optimized for touch devices.
Floating surface anchored to a trigger for rich content.
Short hover or focus hint for icon-only controls.
Rich preview card revealed on hover or focus.
Right-click menu with actions contextual to the target.
Trigger-opened menu for actions, filters, and settings.
Command palette with search, groups, and keyboard shortcuts.
Stacked toast notifications with actions and auto-dismiss.
Provider that flips components between LTR and RTL.