Components
Here you can find all the components available in the library. We are working on adding more.
Accordion
Show and hide content sections, like an FAQ or a settings panel. Easily customizable.
Alert
Show a message in place, like a success confirmation, a warning, or an error. Easily customizable.
Avatar
Show a user's picture, like in profiles, comments, and menus. Easily customizable.
Badge
Mark content with a small status or label, like a count or a category. Easily customizable.
Breadcrumb
Show where a page sits on your site, like in docs or a store. Easily customizable.
Bubble
Show chat messages, like in a messaging app or an AI assistant. Easily customizable.
Button
Trigger actions, like in forms, dialogs, and toolbars. Easily customizable.
Button Group
Attach related buttons into one row, like a split button or a toolbar. Easily customizable.
Card
Group related content on one surface, like a login form or a stat. Easily customizable.
Carousel
Slide through content, like an image gallery or a product showcase. Easily customizable.
Checkbox
Toggle options on and off, like accepting terms or selecting rows. Easily customizable.
Collapsible
Expand and collapse content with a trigger, like a show more button. Easily customizable.
Combobox
Use it as a searchable select with autocomplete, like for countries or tags. Easily customizable.
Command
Search and run actions, like a ⌘K menu or a page finder. Easily customizable.
Dialog
Open a modal window, like for confirmations, forms, and alerts. Easily customizable.
Drawer
Slide a panel in from the screen edge, like a mobile menu or a cart. Easily customizable.
Dropdown
Show a menu of actions, like a user menu or row actions. Easily customizable.
Empty
Say there is nothing to show yet, like an empty list or no results. Easily customizable.
Field
Lay out a control with its label, like an input or a checkbox. Easily customizable.
Forms
Use them to build complete forms, like a login, a signup, or a settings page. Easily customizable.
Input
Capture a single line of text, like a name, an email, or a search query. Easily customizable.
Input Group
Put icons, text, and buttons in one field, like a search box. Easily customizable.
Item
Lay out a row with media, text, and actions, like in a list or a menu. Easily customizable.
Kbd
Show a keyboard key or shortcut, like the hints next to menu items. Easily customizable.
Label
Name a form control, like an input, a checkbox, or a select. Easily customizable.
Marker
Use it for the lines between chat messages, like a date divider or a status. Easily customizable.
Message
Lay out one row of a chat, like in a messaging app or an AI assistant. Easily customizable.
Message Scroller
Auto scroll a chat feed, like a thread or an AI assistant. Easily customizable.
Pagination
Move between pages of content, like a data table or search results. Easily customizable.
Popover
Open a small panel next to a button, like for settings or a quick form. Easily customizable.
Progress
Show how far along a task is, like an upload or an onboarding flow. Easily customizable.
Radio Group
Pick exactly one option from a set, like a plan or a shipping method. Easily customizable.
Scroll Fade
Fade scrollable content at its edges, like a long list or a chat feed. Easily customizable.
Scrollbar
Style or hide the scrollbar of any element, like a sidebar. Easily customizable.
Select
Pick one option from a native dropdown, like a category or a timezone. Easily customizable.
Separator
Use it as a divider line between content, like sections of a page or inline items. Easily customizable.
Sheet
Slide a side panel in from the edge, like an edit form or a menu. Easily customizable.
Shimmer
Sweep a highlight across text, like a thinking indicator. Easily customizable.
Sidebar
Put app navigation beside the page, like in a dashboard or an admin panel. Easily customizable.
Skeleton
Show a placeholder while content loads, like a card or a table. Easily customizable.
Slider
Pick a value from a range, like a volume level or a price cap. Easily customizable.
Switch
Turn a setting on or off, like notifications or dark mode. Easily customizable.
Table
Present tabular data, like invoices, users, or transactions. Easily customizable.
Tabs
Show one section at a time behind a row of tabs, like a settings screen. Easily customizable.
Textarea
Capture multi-line text, like a message, a comment, or feedback. Easily customizable.
Toast
Show a brief message, like a saved confirmation. Easily customizable.
Tooltip
Show a short text hint on hover, like explaining an icon-only button. Easily customizable.