Heading 1 [h1]

Heading 2 [h2]

Heading 3 [h3]

Heading 4 [h4]

Heading 5 [h5]

Heading 6 [h6]

---

Use the lead class on a paragraph to make it stand out, like this one.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer pellentesque sollicitudin tempor. Nullam scelerisque vel arcu vel dignissim. Ut feugiat facilisis dui malesuada mollis.

1. Nulla egestas velit venenatis, facilisis metus finibus, finibus libero.
2. Sed porta est eros.
3. Duis sagittis sit amet leo et mollis.

Fusce et porta neque, eget ullamcorper turpis. Sed massa enim, posuere sed vehicula et, bibendum a diam. Donec quam justo, euismod at nibh sit amet, aliquet fermentum nisi.

• Mauris congue est ac urna commodo, at venenatis nulla pulvinar.
• Phasellus viverra fermentum mattis.
• Nunc tincidunt arcu ipsum, in facilisis urna vulputate sed.

Donec sed pellentesque libero. Duis efficitur mi eu odio imperdiet semper. In egestas diam quam, eleifend pulvinar odio cursus ut. This is a text link.

---

Buttons

Default

Primary Secondary Success Danger Warning Info Light Dark Link

<a href="#" class="btn btn-primary">Primary</a>
<a href="#" class="btn btn-secondary">Secondary</a>
<a href="#" class="btn btn-success">Success</a>
<a href="#" class="btn btn-danger">Danger</a>
<a href="#" class="btn btn-warning">Warning</a>
<a href="#" class="btn btn-info">Info</a>
<a href="#" class="btn btn-light">Light</a>
<a href="#" class="btn btn-dark">Dark</a>
<a href="#" class="btn btn-link">Link</a>

Outline

Primary Secondary Success Danger Warning Info Light Dark

<a href="#" class="btn btn-outline-primary">Primary</a>
<a href="#" class="btn btn-outline-secondary">Secondary</a>
<a href="#" class="btn btn-outline-success">Success</a>
<a href="#" class="btn btn-outline-danger">Danger</a>
<a href="#" class="btn btn-outline-warning">Warning</a>
<a href="#" class="btn btn-outline-info">Info</a>
<a href="#" class="btn btn-outline-light">Light</a>
<a href="#" class="btn btn-outline-dark">Dark</a>
<a href="#" class="btn btn-link">Link</a>

Sizes

Large

<a href="#" class="btn btn-outline-primary btn-lg">Large</a>

Small

<a href="#" class="btn btn-outline-primary btn-sm">Small</a>

Block

<a href="#" class="btn btn-outline-primary btn-block">Block</a>

---

Images

Alignment

Styles

This image is huge, but it resizes with the screen thanks to the img-fluid class.