This is a lead paragraph. It stands out from regular paragraphs with increased font size and weight.

This is a regular paragraph for comparison. You can see the difference in size and weight between lead and regular text.

You can use the mark tag to highlight text.

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.

Start aligned text on all viewport sizes.

Center aligned text on all viewport sizes.

End aligned text on all viewport sizes.

Start aligned text on viewports sized SM (small) or wider.

Start aligned text on viewports sized MD (medium) or wider.

Start aligned text on viewports sized LG (large) or wider.

Start aligned text on viewports sized XL (extra-large) or wider.

Lowercased text.

Uppercased text.

CapiTaliZed text.

.fs-1 text

.fs-2 text

.fs-3 text

.fs-4 text

.fs-5 text

.fs-6 text

Bold text.

Bolder weight text (relative to the parent element).

Semibold weight text.

Normal weight text.

Light weight text.

Lighter weight text (relative to the parent element).

Italic text.

Text with normal font style

This is a long paragraph written to show how the line-height of an element is affected by our utilities. Classes are applied to the element itself or sometimes the parent element.

This is a long paragraph written to show how the line-height of an element is affected by our utilities. Classes are applied to the element itself or sometimes the parent element.

This is a long paragraph written to show how the line-height of an element is affected by our utilities. Classes are applied to the element itself or sometimes the parent element.

This is a long paragraph written to show how the line-height of an element is affected by our utilities. Classes are applied to the element itself or sometimes the parent element.

• This is a list.
• It appears completely unstyled.
• Structurally, it's still a list.
• However, this style only applies to immediate child elements.
• Nested lists:
  • are unaffected by this style
  • will still show a bullet
  • and have appropriate left margin
• This may still come in handy in some situations.

1. This is a list.
2. It appears completely styled.
3. Structurally, it's still a list.
4. However, this style only applies to immediate child elements.
5. Nested lists:
   1. are unaffected by this style
   2. will still show numbers
   3. and have appropriate left margin
6. This may still come in handy in some situations.

• This is a list.
• It appears completely unstyled.
• Structurally, it's still a list.
• However, this style only applies to immediate child elements.
• Nested lists:
  • are unaffected by this style
  • will still show a bullet
  • and have appropriate left margin
• This may still come in handy in some situations.

Description lists

A description list is perfect for defining terms.

Euismod

Vestibulum id ligula porta felis euismod semper eget lacinia odio sem nec elit.

Donec id elit non mi porta gravida at eget metus.

Malesuada porta

Etiam porta sem malesuada magna mollis euismod.

Truncated term is truncated

Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh.

Description lists

A description list is perfect for defining terms.

Euismod

Vestibulum id ligula porta felis euismod semper eget lacinia odio sem nec elit.

Donec id elit non mi porta gravida at eget metus.

Malesuada porta

Etiam porta sem malesuada magna mollis euismod.

Truncated term is truncated

Fusce dapibus, tellus ac cursus commodo.

Nesting

Nested definition list

Aenean posuere, tortor sed cursus feugiat.

A well-known quote, contained in a blockquote element.

.text-primary

.text-secondary

.text-success

.text-danger

.text-warning

.text-info

.text-light

.text-dark

.text-body

.text-muted

.text-white

.text-black-50

.text-white-50

Stylized implementation of HTML's <abbr> element for abbreviations and acronyms to show the expanded version on hover. Abbreviations have a default underline and gain a help cursor to provide additional context on hover and to users of assistive technologies.

Add .initialism to an abbreviation for a slightly smaller font-size.

attr

HTML