Buttons
Typography
Heading 1
Heading 2
Heading 3
Heading 4
Heading 5
Heading 6
Body text example – dit is standaard tekst voor een UI-kit.
Body text example – dit is gedempte tekst voor een UI-kit.
Cards
KPI Card
1.284
Active leasesRevenue
€ 48K
+12% this monthForms
Clickable cards
Leverancier
Meld u aan op de portaal
Leverancier
Meld u aan op de portaal
Leverancier
Meld u aan op de portaal
Leverancier
Meld u aan op de portaal
Leverancier
Meld u aan op de portaal
Leverancier
Meld u aan op de portaal
Leverancier
Meld u aan op de portaal
Table
| Vehicle | Status | Driver |
|---|---|---|
| Tesla Model 3 | Active | Jan Jansen |
| BMW i4 | Pending | Lisa de Vries |
Alerts
Success message
Warning message
Error message
Colors
Primary
turquoise-l2
turquoise-l1
turquoise
turquoise-d1
turquoise-d2
turquoise-75
turquoise-50
turquoise-25
turquoise-l2
turquoise-l1
turquoise
turquoise-d1
turquoise-d2
turquoise-75
turquoise-50
turquoise-25
blue-l2
blue-l1
blue
blue-d1
blue-d2
blue-75
blue-50
blue-25
blue-l2
blue-l1
blue
blue-d1
blue-d2
blue-75
blue-50
blue-25
yellow-l2
yellow-l1
yellow
yellow-d1
yellow-d2
yellow-75
yellow-50
yellow-25
yellow-l2
yellow-l1
yellow
yellow-d1
yellow-d2
yellow-75
yellow-50
yellow-25
white-l2
white-l1
white
white-d1
white-d2
white-75
white-50
white-25
white-l2
white-l1
white
white-d1
white-d2
white-75
white-50
white-25
Secondary
deep-azure-l2
deep-azure-l1
deep-azure
deep-azure-d1
deep-azure-d2
soft-yellow-l2
soft-yellow-l1
soft-yellow
soft-yellow-d1
soft-yellow-d2
pale-turquoise-l2
pale-turquoise-l1
pale-turquoise
pale-turquoise-d1
pale-turquoise-d2
teal-l2
teal-l1
teal
teal-d1
teal-d2
Additionary
ad-green1
ad-green2
ad-green3
ad-green4
ad-blue
Messages
warning
warning-50
warning-25
success
success-50
success-25
danger
danger-50
danger-25
Tabs
Focus box
Focus box left
Highlight box
Capsule