The UI components page
The page that shows every reusable component with live examples, and how to use them in your own pages.
What is on the page
UI Components in the sidebar opens /en/dashboard/ui-component: every component the dashboard is built from, each in a card with live examples you can click, type in and open. They follow the brand colour, the light or dark mode and the language direction, like the rest of the dashboard.
| Tab | Components |
|---|---|
| Inputs | Input and textarea, calendar, date picker, phone input, country select, checkbox, switch, select |
| Tables | Table |
| Cards | Draggable stat cards, card |
| Dialogs & Sheets | Dialog, sheet |
| Menus & Dropdowns | Dropdown menu, popover |
| Buttons | Button, icon button |
| Indicators | Badge, avatar |
| Navigation | Tabs, pagination |
| Feedback | Tooltip |
The page opens on Inputs. Add ?tab= and a tab's id to open another one directly, such as /en/dashboard/ui-component?tab=tables. The ids are inputs, tables, cards, dialogs, menus, buttons, indicators, navigation and feedback.
Use a component in your page
Included with your purchase. Sign in to read, or open it in your download.
Where the components live and how to import them.
Where the examples live
Included with your purchase. Sign in to read, or open it in your download.
The example files behind each card, to copy from or to remove the page.