> For the complete documentation index, see [llms.txt](https://bootstrapbay.gitbook.io/grace-ui-kit/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://bootstrapbay.gitbook.io/grace-ui-kit/components/typography.md).

# Typography

### Options

The typography for the Grace UI Kits makes use of two font styles: [Montserrat ](https://fonts.google.com/specimen/Montserrat)and [Libre Baskerville](https://fonts.google.com/specimen/Libre+Baskerville). If you want to use one or the other, you must specify the class `.montserrat` or `.libre`. Both fonts are available for free from Google Fonts and need to be imported in the head section of your page.

Here is an example for the Libre headers:

![](/files/-LG5y6gXDNVxVs3J0xb6)

```markup
<div class="libre">
    <h1>Headline 1</h1>
    <p class="sub-text">60px</p>
    <h2>Headline 2</h2>
    <p class="sub-text">46px</p>
    <h3>Headline 3</h3>
    <p class="sub-text">34px</p>
    <h4>Headline 4</h4>
    <p class="sub-text">30px</p>
    <h5>Headline 5</h5>
    <p class="sub-text">24px</p>
    <h6>Headline 6</h6>
    <p class="sub-text">18px</p>
</div>
```

### Colors

We have added 2 new classes for text colors `.text-pinkish-tan` and `.text-navy`.

![](/files/-LG5yUU5NI4liGbf6TgK)

```markup
<p class="text-pinkish-tan">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.</p>
<p class="text-navy">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.</p>
```

If you want to see more examples and properties please check the official [Bootstrap Documentation](https://getbootstrap.com/docs/4.0/content/typography/)