-
Getting Started
Getting Started
-
Button
Actions Button
-
Icon Button
Actions Icon Button
-
Bottom Sheet
Containers & layout Bottom Sheet
-
Dialog
Containers & layout Dialog
-
Drawer
Containers & layout Drawer
-
Dropdown
Containers & layout Dropdown
-
Accordion
Content display Accordion
-
Avatar
Content display Avatar
-
Carousel
Content display Carousel
-
List
Content display List
-
Table
Content display Table
-
Authenticator
Forms & selection controls Authenticator
-
Checkbox
Forms & selection controls Checkbox
-
Chip
Forms & selection controls Chip
-
Input
Forms & selection controls Input
-
Radio
Forms & selection controls Radio
-
Segmented Control
Forms & selection controls Segmented Control
-
Select
Forms & selection controls Select
-
Switch
Forms & selection controls Switch
-
Textarea
Forms & selection controls Textarea
-
Badge
Indicators & status Badge
-
Circular Progress
Indicators & status Circular Progress
-
Linear Progress
Indicators & status Linear Progress
-
Loader
Indicators & status Loader
-
Placeholder
Indicators & status Placeholder
-
Tag
Indicators & status Tag
-
Alert
Messaging & feedback Alert
-
Snackbar
Messaging & feedback Snackbar
-
Tooltip
Messaging & feedback Tooltip
-
Breadcrumb
Navigation Breadcrumb
-
Menu
Navigation Menu
-
Pagination
Navigation Pagination
-
Tab List
Navigation Tab List
Dropdown
Content
<.dropdown > <:trigger> Open Dropdown </:trigger> <div class="w-full flex items-center justify-center h-space-80 bg-brand-subtle text-brand"> Content </div> </.dropdown>