State Colors

State Class postfix Usage example
Bootstrap States
Success *-success btn-success kt-font-success
Warning *-warning btn-warning kt-font-warning
Danger *-danger btn-danger kt-font-danger
Info *-info btn-info kt-font-info
Primary *-primary btn-primary kt-font-primary
Metronic Custom States
Brand *-brand btn-success kt-font-brand
Dark *-dark btn-dark kt-font-dark
Light *-light btn-light kt-font-light

Base Colors

Level Preview Class example
Label Classes
Level 1 Font Color   BG Color kt-label-font-color-1  kt-label-bg-color-1
Level 2 Font Color   BG Color kt-label-font-color-2  kt-label-bg-color-2
Level 3 Font Color   BG Color kt-label-font-color-3  kt-label-bg-color-3
Level 4 Font Color   BG Color kt-label-font-color-4  kt-label-bg-color-4
Shape Classes
Level 1 Font Color   BG Color kt-shape-font-color-1  kt-shape-bg-color-1
Level 2 Font Color   BG Color kt-shape-font-color-2  kt-shape-bg-color-2
Level 3 Font Color   BG Color kt-shape-font-color-3  kt-shape-bg-color-3
Level 4 Font Color   BG Color kt-shape-font-color-4  kt-shape-bg-color-4

Typography Examples

Apply state color classes to any typography element:
Success state text  Warning state text  Info state text

Danger state text  Primary state text  Focus state text
Apply base color classes to any typography element:
Label color level 4   Label color level 3   Label color level 2   Label color level 1

Button Examples

Alert Examples

25%

Select A Demo

Demo 13
Demo 14
Demo 15
Demo 16
Demo 17
Demo 18
Demo 19
Demo 20
Demo 21
Demo 22
Demo 23
Demo 24
Demo 25
Demo 26
Demo 27
Demo 28
Demo 29
Demo 30
Buy Metronic Now!