Base

Colors
#cfb4f5Primary Light
#6f11f5Primary
#470b9cPrimary Dark
#e3e3e9Secondary Light
#a5a5a8Secondary
#6f6f72Secondary Dark
#b8dd9bSuccess Light
#50aa08Success
#377603Success Dark
#c3d3f8Info Light
#0d52eeInfo
#09369eInfo Dark
#f8d9adWarning Light
#fa970bWarning
#db7100Warning Dark
#f28d8dDanger Light
#df0b0bDanger
#a20404Danger Dark
#36373aDark
#1d1d24Inverse
#000Black
#f1f2f3Light Grey
#d6d7d8Grey
#515254Dark Grey
 
Shadows
.shadow-xs .shadow-sm .shadow .shadow-lg .shadow-xl
 
Animations
.zoom .pulse .pulse-hover .move-vertical .move-horizontal
 
Entrance Animations ( Scroll Up & Down to see the entrance animations )
fade-right fade fade-up fade-down fade-left zoom-in zoom-out slide-up flip-up flip-down flip-right flip-left
 
Rotate
 
.rotate-1 .rotate-2 .rotate-3 .rotate-4 .rotate-5
 
 
Typography

Headings

H1 Heading

H2 Heading

H3 Heading

H4 Heading

H5 Heading
H6 Heading

Paragraphs

Large Paragraph (lead).

Regular Paragraph.

.fw-thin .fw-light .fw-regular .fw-medium .fw-bold .primary-font .secondary-font

.text-primary .text-secondary .text-success .text-info .text-warning .text-danger

Blockquotes

Default Blockquote.

Jacob Ginnish CEO @ A Company

Lists

  • Aliquam molestie quam intin bibendum
  • Morbi quis neque non nistas pharetra
  • Donec blandit dapibus ex eu euismod
  • Pellentesque habitant morbi tristique
  • Aenean auctor sit amet augue lacinia
  • Vestibulum porttitor tortor facilisis
  • Nullam vitae libero nec augue felis
  • Sed consectetur tellus tortor vitae
 
Alerts & Badges

Alerts

Badges

Primary Secondary Success Info Warning Danger
 

Pill Badges

Primary Secondary Success Info Warning Danger
 

Icon Badges

 

Heading with badge

H4 heading with Badge

 
Toasts

Default Toast

Notification Toast

Primary Toast

Dark Notification Toast

Toast Triggers