Getting Started
Components
Explore the available UI components and their usage.
Browse the components below. New and Updated and Core Components use component cards; Data Display lists data-related components in a table. Each item links to its documentation.
New and Updated
Core Components
Button
Explore →Displays a button or a component that looks like a button.
Input
Explore →Displays a form input field or a component that looks like an input field.
Dialog
Explore →A window overlaid on either the primary window or another dialog window.
Dropdown Menu
Explore →Displays a menu to the user — such as a set of actions or functions.
U
Avatar
Explore →An image element with a fallback for representing the user.
Toggle
Switch
Explore →A control that allows the user to toggle between checked and not checked.
Data Display
| Component | Description | Link |
|---|---|---|
| Table | Semantic table built with Tailwind. Use with Data Table for sorting, filtering, and pagination. | View → |
| Data Table | Powerful table and datagrids with TanStack Table: sorting, filtering, pagination, row actions. | View → |
| List View | List item component with multiple layout variants. Use for rows with icon, title, and value. | View → |
| Skeleton | Placeholder for loading content with a pulse animation. | View → |
| Badge | Displays a badge or a component that looks like a badge. | View → |
Interactive Forms
Profile Settings
Manage your account settings and preferences.
UsernameThis is your public display name.
Email
Bio
Heads up!
You can add components to your app using the cli.
Tab Content Area
Analytics Integration
Traffic Overview
Daily unique visitors over the last 30 days.