# Typography

Learn more about the typography that is used in Volt Laravel Admin Dashboard

Volt uses Nunito Sans from Google fonts by default. You can change the font by importing another font from Google Fonts and changing the `$font-family-base` Sass variable value from `_variables.scss`.

## Headings

# h1. Themesberg heading

## h2. Themesberg heading

### h3. Themesberg heading

#### h4. Themesberg heading

##### h5. Themesberg heading

###### h6. Themesberg heading

    <h1>h1. Themesberg heading</h1>
    <h2>h2. Themesberg heading</h2>
    <h3>h3. Themesberg heading</h3>
    <h4>h4. Themesberg heading</h4>
    <h5>h5. Themesberg heading</h5>
    <h6>h6. Themesberg heading</h6>

### Display headings

Use `.display-1-*`, `.display-2-*` (eg. `.display-1-lg`, `.display-2-sm`) to increase the font size of text elements based on screen size.

# Display 1

# Display 2

# Display 3

# Display 4

    <h1 class="display-1">Display 1</h1>
    <h1 class="display-2">Display 2</h1>
    <h1 class="display-3">Display 3</h1>
    <h1 class="display-4">Display 4</h1>

## Paragraphs

Sometimes when you innovate, you make mistakes. It is best to admit them quickly, and get on with improving your other innovations.

My favorite things in life don’t cost any money. It’s really clear that the most precious resource we all have is time.

    <p>Sometimes when you innovate, you make mistakes. It is best to admit them quickly, and get on with improving your other innovations.</p>
    <p>My favorite things in life don’t cost any money. It’s really clear that the most precious resource we all have is time.</p>

### Lead Paragraphs

Sometimes when you innovate, you make mistakes. It is best to admit them quickly, and get on with improving your other innovations.

    <p class="lead">Sometimes when you innovate, you make mistakes. It is best to admit them quickly, and get on with improving your other innovations.</p>

## Inline modifiers

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.

    <p>You can use the mark tag to <mark>highlight</mark> text.</p>
    <p><del>This line of text is meant to be treated as deleted text.</del></p>
    <p><s>This line of text is meant to be treated as no longer accurate.</s></p>
    <p><ins>This line of text is meant to be treated as an addition to the document.</ins></p>
    <p><u>This line of text will render as underlined</u></p>
    <p><small>This line of text is meant to be treated as fine print.</small></p>
    <p><strong>This line rendered as bold text.</strong></p>
    <p><em>This line rendered as italicized text.</em></p>

## Blockquotes

> "Themesberg makes beautiful products to help people with creative ideas succeed. Our company empowers millions of people."

    <blockquote class="blockquote text-center">
        "Themesberg makes beautiful products to help people with creative ideas succeed. Our company empowers millions of people."
    <footer class="blockquote-footer mt-3 text-primary">Jason Doe</footer>
    </blockquote>

## Lists

### Unordered list

- Minutes of the last meeting
- Do we need yet more meetings?
- Any other business
  - Programming
  - Web Design
  - Database
- Something funny

    <ul>
        <li>Minutes of the last meeting</li>
        <li>Do we need yet more meetings?</li>
        <li>Any other business
            <ul>
                <li>Programming</li>
                <li>Web Design</li>
                <li>Database</li>
            </ul>
        </li>
        <li>Something funny</li>
    </ul>

### Ordered list

1. Minutes of the last meeting
2. Do we need yet more meetings?
3. Any other business
   1. Programming
   2. Web Design
   3. Database
4. Something funny

    <ol>
        <li>Minutes of the last meeting</li>
        <li>Do we need yet more meetings?</li>
        <li>Any other business
            <ol>
                <li>Programming</li>
                <li>Web Design</li>
                <li>Database</li>
            </ol>
        </li>
        <li>Something funny</li>
    </ol>