HTML headings Default
All HTML headings, are available. .h1 through .h7 classes are also available, for when you want to match the font styling of a heading.
PREVIEWFONT SIZE

Heading 1

60px

Heading 2

48px

Heading 3

36px

Heading 4

30px
Heading 5
24px
Heading 6
20px
Light / Bold Headings
All HTML headings are available with light and bold font-weight. Use .font-weight-normal for light heading and .
LIGHT HEADINGSBOLD HEADINGS

Heading

Heading

Heading 2

Heading 2

Heading 3

Heading 3

Heading 4

Heading 4

Heading 5
Heading 5
Heading 6
Heading 6
Texts
TypeClassText
Titletext-lg
Cupcake ipsum dolor sit amet fruitcake donut chocolate.
font-size: 18px / line-height: 28px / font-weight: 500
Sub Titletext-base
Cupcake ipsum dolor sit amet fruitcake donut chocolate.
font-size: 16px / line-height: 24px / font-weight: 400
Body Texttext-sm
Cupcake ipsum dolor sit amet fruitcake donut chocolate.
font-size: 14px / line-height: 20px / font-weight: 400
Small Texttext-xs
Cupcake ipsum dolor sit amet fruitcake donut chocolate.
font-size: 12px / line-height: 18px / font-weight: 400
Customizing headings Default
Use the included utility classes to recreate the small secondary-500 heading text.

Display heading

Display heading

Display heading

Display heading

Display heading
Display heading
Heading colors
Use the included utility classes to recreate the small secondary-500 heading text.

Display heading

Display heading

Display heading

Display heading

Display heading
Display heading
Display Headings
Traditional heading elements are designed to work best in the meat of your page content. When you need a heading to stand out, consider using a display heading—a larger, slightly more opinionated heading style.

Display 1

Display 2

Display 3

Display 4

Inline Text Elements

Styling for common inline HTML5 elements.

This line of text is meant to be treated as deleted text.

This line of text is meant to be treated as an addition to the

This line of text is meant to be treated as deleted text.

Text Color

Styling for common inline HTML5 elements.

Styling for common inline HTML5 elements.

Styling for common inline HTML5 elements.

This is warning-500 text You can archive this adding .text-warning-500 class

This is danger-500 text You can archive this adding .text-danger-500 class

Listing Typography
Unorder list.
  • 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.
list-decimal
  1. Lorem ipsum dolor sit amet.
    1. Lorem ipsum dolor sit amet.
  2. Lorem ipsum dolor sit amet.
  3. Lorem ipsum dolor sit amet.
  4. Lorem ipsum dolor sit amet.
  5. Lorem ipsum dolor sit amet.
Dash list
  • 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.
Icon List 1
  • 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.
Icon List 2
  • 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.
Icon List 3
  • 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.
Blockquotes
Lorem, ipsum dolor sit amet consectetur adipisicing elit. Accusamus laudantium omnis fugit ducimus nulla libero temporibus corrupti non voluptatem harum?Dashcode Admin Template
Lorem, ipsum dolor sit amet consectetur adipisicing elit. Accusamus laudantium omnis fugit ducimus nulla libero temporibus corrupti non voluptatem harum?Dashcode Admin Template
Lorem, ipsum dolor sit amet consectetur adipisicing elit. Accusamus laudantium omnis fugit ducimus nulla libero temporibus corrupti non voluptatem harum?Dashcode Admin Template