Primary (#3B71CA)

Secondary (#9FA6B2)

Success (#14A44D)

Danger (#DC4C64)

Warning (#E4A11B)

Info (#54B4D3)

Light (#F9FAFB)

Dark (#1F2937)

Lorem ipsum dolor sit amet

Lorem ipsum dolor sit amet

Lorem ipsum dolor sit amet

Lorem ipsum dolor sit amet

Lorem ipsum dolor sit amet

Lorem ipsum dolor sit amet

Lorem ipsum dolor sit amet

Lorem ipsum dolor sit amet

Primary

50

#F1F5FB

100

#E3EBF7

200

#C7D7F0

300

#ABC2E8

400

#8FAEE0

500

#6590D5

600

#3061AF

700

#285192

800

#204075

900

#183058

Secondary

50

#F8F9F9

100

#F1F2F4

200

#E4E6E9

300

#D6D9DE

400

#C8CCD3

500

#B3B9C2

600

#848D9C

700

#6B7585

800

#565D6B

900

#404650

Success

50

#EAFCF2

100

#D6FAE4

200

#ACF5C9

300

#83F0AE

400

#59EA93

500

#1CE26B

600

#118C42

700

#0E7537

800

#0C5D2C

900

#094621

Danger

50

#FCF2F4

100

#FAE5E9

200

#F5CCD3

300

#F0B2BD

400

#EB99A6

500

#E37285

600

#D42A46

700

#B0233A

800

#8D1C2F

900

#6A1523

Warning

50

#FDF8EF

100

#FBF2DE

200

#F7E4BE

300

#F4D79D

400

#F0C97D

500

#EAB54C

600

#C48A17

700

#A37313

800

#825C0F

900

#62450B

Info

50

#F3FAFC

100

#E7F4F9

200

#CEE9F2

300

#B6DFEC

400

#9ED4E6

500

#79C4DC

600

#34A4CA

700

#2B89A8

800

#236D86

900

#1A5265

Alerts

Badges

Primary Secondary Success Danger Warning Info Light Dark

Buttons hierarchy

Buttons contextual

Buttons neutral

Pagination

Pills

Tabs