Layout
Components for defining page structure and arranging content using page shells, grids, flexbox, and other layout systems.
Page
Semantic responsive container for page-level layouts.
Grid
Responsive grid layout with container query support.
Flex
Flexbox layout with container query support.
Gallery
Responsive grid for displaying images and media.
Expand
Collapsible component for expanding hidden sections.
Panel
Resizable layout regions with collapsible sidebars.
Composition
Higher-level components combining primitives to create complex, reusable UI patterns.
Group
Groups controls with unified borders.
List
Displays item collections with built-in selection and actions.
Toolbar
Groups action buttons into a structured strip for operations.
Action
Interactive elements like buttons and links that trigger actions, navigation, or form submission.
Button
Clickable element that triggers an action.
Confirm
Confirm dialog for critical user actions.
Command
Searchable command palette with instance-scoped trigger and controller APIs.
Voice
Captures voice input with recording controls and audio visualization.
Input
Form elements for capturing and validating user input, such as text fields, checkboxes, radio buttons, selects, and sliders.
Date
Date picker with calendar and keyboard navigation.
Checkbox
Input for selecting one or multiple options.
Color
Color picker with hue slider and format selection.
Input
Text input field for capturing user data.
Radio
Radio button for selecting one option from a group.
Select
Dropdown select component for choosing from multiple options.
Slider
Slider component for selecting a value from a range.
Switch
Toggle switch for boolean input.
Textarea
Multi-line text input field for longer user input.
Information
Read-only components for displaying static content like labels, badges, tooltips, and descriptive text.
Banner
Full-width strip for surfacing alerts, notices, and messages.
Badge
Small badge for displaying labels or status indicators.
Label
Text label for form elements.
Tooltip
Displays additional information on hover or focus.
Timeline
Shows events along a chronological axis for history and progress.
Feedback
Components that notify users of system status, success, errors, or progress through alerts and temporary messages.
Popover
Popover component for displaying content on demand.
Progress
Progress bar component for showing completion status.
Skeleton
Decorative placeholders with rectangle, text, and media shapes.
Toast
Temporary notification messages.
Loading
Displays an animated indicator to communicate ongoing activity.
Alert
Surfaces important messages inline to inform or warn users.
Container
Components that group and organize related content with visual and semantic structure.
Card
Container for grouping related content.
Modal
Modal dialog for focusing user attention on important content.
Scroll
Scroll area with custom scrollbars for overflow.
Mask
Container with fading edge effects on content.
Frame
Decorative border with advanced SVG path support.
Display
Components for presenting content and visual structure, such as dividers, tables, code, and data visualizations.
Divider
Horizontal or vertical separator for dividing content.
Table
Expressive table component with consumer-defined headers and cell rendering logic.
Code
Displays syntax-highlighted code with a copy button.
Chart
Visualizes structured data with bars, lines, and trend displays.
Media
Components for presenting images, video, icons, and rich visual assets.
Image
Displays responsive images with framing, loading, and presentation controls.
Icon
Renders scalable symbols with consistent sizing, color, and accessibility.
Video
Embeds video content with playback framing and responsive presentation.