Typography

Typography

Documentation and examples for Bootstrap typography, including global settings, headings, body text, lists, and more.

Text

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5
Heading 6

Fancy display heading With faded secondary text

Lead — Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Duis mollis, est non commodo luctus.

Paragraph — Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam.

You can click me!

Text Colors

Text Primary
Text Secondary
Text Success
Text Info
Text Warning
Text Light
Text Dark

Inline Text Element

You can use the mark tag to highlighttext.

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

This line of text is meant to be treated as no longer accurate.

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

This line of text will render as underlined

This line of text is meant to be treated as fine print.

This line rendered as bold text.

This line rendered as italicized text.

Abbreviations

attr

HTML

Color

Primary
Secondary
Success
Info
Warning
Danger
Light
Dark

Text Block

Blockquote
CodiePie made with hand
Inline Code

Lorem ipsum dolor sit amet, consecteturadipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitationullamco laboris nisi ut aliquip ex ea commodo consequat.

Code Block

We use PrismJS to do this, you can adjust themes, syntax and more. Visit their documentation.

var code = 'Hello';

Display

Display 1

Display 2

Display 3

Display 4

Naming a Source

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.

Someone famous in Source Title

List

Unordered List

Sunt in culpa qui officia deserunt mollit anim id est laborum:

  • Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
  • tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
  • quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
  • consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
  • cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
  • proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Ordered List

Sunt in culpa qui officia deserunt mollit anim id est laborum:

  1. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
  2. tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
  3. quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
  4. consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
  5. cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
  6. proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
  7. consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse