Every building block in one place
Each component is built on the colour, spacing, and typography tokens from the foundations pages. They all share the same padding rules, focus styles, and sizing conventions so they feel consistent when combined. Click into any component to see its variants, states, and sizing options.
Section 1expand_more
Section 2expand_more
Accordion
Heads up
Alert
Confirm?
Cancel
OK
Alert dialog
dashboardDashboard
analyticsAnalytics
settingsSettings
App sidebar
Avatar
InfoSuccessError
Badge
Homechevron_rightSectionchevron_rightPage
Breadcrumb
Button
Button group
Card
chevron_left
chevron_right
Carousel
Chart
Checkbox
Circular button
dd/mm/yyyy
Date input
calendar_month
Date picker
Selectexpand_more
Dropdown
personProfile
settingsSettings
logoutLog out
Dropdown menu
Enter text...
Input
1First
2Second
Instructions
Navigation
Popover
Popover
Progress bar
Option A
Option B
Radio button
Section
Section title
Option A
Option B
Selection card
Segmented control
Skeleton
Slider
Spinner
Table
Tabs
Enter text...
Textarea
check_circleSaved
Toast
Toggle group
check
Toggle switch
Tooltip