--- title: Typography page-header: Typography menu: base.typography ---
{% card title="Card title" %} Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto corporis cumque debitis dicta dolores error esse explicabo incidunt inventore minima, officiis quis reprehenderit saepe sed sit vel voluptatem, voluptatibus? {% endcard %}
Headings

# h1. Heading text

## h2. Heading text

### h3. Heading text

#### h4. Heading text

##### h5. Heading text

###### h6. Heading text

Headings with secondary text

# h1. Heading text Secondary text

## h2. Heading text Secondary text

### h3. Heading text Secondary text

#### h4. Heading text Secondary text

##### h5. Heading text Secondary text

###### h6. Heading text Secondary text

Body text

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus ornare iaculis purus, eget gravida est lacinia at. Nam magna dolor, vestibulum ut consequat in, dictum a metus.

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Alias aliquid amet asperiores assumenda at, commodi est, et, fugiat in ipsam iure mollitia optio quas reiciendis rem repellat sed similique voluptatibus.

Lead body

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus ornare iaculis purus, eget gravida est lacinia at. Nam magna dolor, vestibulum ut consequat in, dictum a metus.

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Alias aliquid amet asperiores assumenda at, commodi est, et, fugiat in ipsam iure mollitia.

Alignment types

Left aligned text.

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Alias aliquid beatae consequatur culpa, deserunt, doloribus ea et inventore iste molestias nihil nobis officiis qui reiciendis sint totam ullam veritatis vitae.

Center aligned text.

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aperiam consequatur error esse, facilis harum, ipsa libero minima modi nisi nobis obcaecati odit officia officiis quis quisquam quos sapiente, sunt. Ab.

Right aligned text.

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Consectetur deleniti dicta eius excepturi facere nulla quia sequi sit soluta ullam! Animi commodi cupiditate, enim id maiores minus mollitia sed temporibus!

Unordered list

- lorem ipsum doloret
- lorem ipsum doloret
- lorem ipsum doloret
- lorem ipsum doloret
  - lorem ipsum doloret
  - lorem ipsum doloret
  - lorem ipsum doloret
- lorem ipsum doloret
- lorem ipsum doloret
- lorem ipsum doloret
- lorem ipsum doloret

Ordered list

1. lorem ipsum doloret
2. lorem ipsum doloret
3. lorem ipsum doloret
4. lorem ipsum doloret
5. lorem ipsum doloret
6. lorem ipsum doloret
7. lorem ipsum doloret
8. lorem ipsum doloret
9. lorem ipsum doloret
10. lorem ipsum doloret
11. lorem ipsum doloret

Unordered list

- lorem ipsum doloret
- lorem ipsum doloret
- lorem ipsum doloret
- lorem ipsum doloret
  - lorem ipsum doloret
  - lorem ipsum doloret
  - lorem ipsum doloret
- lorem ipsum doloret
- lorem ipsum doloret
- lorem ipsum doloret
- lorem ipsum doloret

Blockquotes

> Maecenas id tellus felis. Phasellu s eu magna ornare, ultrices metus yet odio. Cras et lectus vitae diam rutrum hendrerit.

> Fusce bibendum in velit nec ullamcorper. Nullam elementum erat eu nisi venenatis elementum. Suspendisse maximus.

Text elements

You can use the mark tag to highlight text.

This line of text is meant to be treated as deleted

This line of text will render as underlined.

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

The following snippet of text is rendered as bold text.

The following snippet of text is rendered as italicized text.

Text color

This is an example of muted text.

This is an example of success text.

This is an example of info text.

This is an example of warning text.

This is an example of danger text.

Addresses