Overview

Accordion

Display content in a collapsible section. Perfect for showing and hiding content.

Avatar

Represent user profile picture or initials. Supports images, fallbacks, and different sizes for user interfaces.

Chip

Categorize or label content. Perfect for tags, filters, and status indicators

Image

Component for handling images wrapped around the HTML img element.

Table

Display data in a tabular format with configurable border styles.

Alert Dialog

For displaying a alert dialog prompt. Perfect for displaying important information to the user.

Dialog

Display of a modal component for confirmations, forms, and important user interactions.

Dialogs Manager

Used for programmatically controlling multiple dialogs. Manages dialog state and provides easy API for complex workflows.

Drawer

Render content that slides in from the side of the screen. Perfect for navigation menus and secondary content.

Dropdown

Create an accessible dropdown menu. Perfect for action menus, user profiles, and contextual options.

Hover Card

Display content when hovering over an element. Rich hover interactions with complex content and media.

Popover

Show detailed information inside a pop-up. Perfect for additional context and interactive content.

Tooltip

Display additional information when a user hovers over an element. Provides contextual help and descriptions.

Alert

Communicate a state that affects a system, feature or page. Provides contextual feedback to users.

Toast

Display a temporary message to the user. Perfect for notifications, confirmations, and status updates.

Box

The most abstract styling component on top of which all other components are built. Provides flexible layout capabilities.

Flex

Manage flex layouts. Provides easy-to-use flexbox properties for responsive and flexible designs.

Grid

Manage grid layouts. CSS Grid component for complex two-dimensional layouts and responsive designs.

Stack

Layout its children in a vertical or horizontal stack. Perfect for organizing content with consistent spacing.

Button

Trigger an action or event. Supports multiple variants, sizes, and states for different use cases.

Icon Button

A button that contains only an icon. Perfect for toolbar actions, close buttons, and compact interfaces.

Split Button

A button with a dropdown menu attached. Combines primary action with secondary options in one component.

Cascader

Select values from hierarchical nested options. Perfect for location selection, category browsing, and multi-level data selection.

Checkbox

Select multiple values from several options. Supports indeterminate state.

Form Helper Text

Provide additional context and instructions for form fields. Supports error and info states.

Form Label

Add labels to form fields. Supports required indicators, tooltips, and accessibility features.

Form Input

Enhanced input component with label, helper text, and error states. Perfect for complex form layouts.

Input

Get user input in a text field. Supports various types, validation, and accessibility features.

Radio

Select one option from several options. Perfect for single-choice selections in forms and surveys.

Select

Pick a value from predefined options. Supports single and multi-select with search functionality.

Separator

Visually separate content. Horizontal or vertical divider component for organizing interface sections.

Slider

Allow users to make selections from a range of values. Perfect for numeric inputs and settings.

Switch

Capture a binary state. Toggle switch component for on/off settings and preferences.

Textarea

Enter multiple lines of text. Perfect for comments, descriptions, and long-form content input.

Calendar Range

Select a range of dates from a calendar interface. Supports date ranges, validation, and localization.

Calendar

Display a calendar interface. Supports date ranges, validation, and localization.

DatePicker

Select dates from a calendar interface. Supports date ranges, validation, and localization.

TimePicker

Select time values with hour and minute precision. Supports 12/24 hour formats and validation.

Text

Render text and paragraphs within an interface. Provides consistent typography with size and weight variants.

Heading

Render semantic HTML heading elements. Provides consistent heading styles with proper hierarchy and accessibility.

Link

Provide accessible navigation between pages. Supports internal and external links with proper styling.

Pagination

Navigate through a series of pages. Provides numbered navigation for large datasets and content lists.

Stepper

Indicate progress through a multi-step process. Perfect for wizards, forms, and guided workflows.

Tabs

Display content in a tabbed interface. Organizes content into sections with easy navigation between them.

Circle Loader

Provide a visual cue that an action is processing. Circular progress indicator for loading states.

Line Loader

Display progress status for a task. Linear progress indicator with customizable appearance and behavior.