> For the complete documentation index, see [llms.txt](https://jolzee.gitbook.io/leopard/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://jolzee.gitbook.io/leopard/content-styling/css-styles.md).

# CSS Styles

Vuetify exposes a wealth of CSS styles that can be referenced in the text of Teneo responses. This includes specific colors, primary and secondary colors (your theme colors), paddings and margins.

Vuetify defines a bunch of helper classes that can be used to add color, decoration, font size, margins and paddings. The classes can be found on the following pages.

| Type                          | Vuetify Link                                                      |
| ----------------------------- | ----------------------------------------------------------------- |
| Elevation                     | <https://vuetifyjs.com/en/styles/elevation/>                      |
| Colors                        | <https://vuetifyjs.com/en/styles/colors/>                         |
| Border Radius                 | <https://vuetifyjs.com/en/styles/border-radius/>                  |
| Spacing » Margins and Padding | <https://vuetifyjs.com/en/styles/spacing/>                        |
| Text and Typography           | <https://vuetifyjs.com/en/styles/text-and-typography/#typography> |

## Markdown and HTML example

```markup
> ### The quartely results look good!
>
> - Revenue was off the chart.
> - Profits were higher than ever
>
> *Everything* is `going according` to **plan**.

Lorem ipsum dolor sit amet
----
Some <b>more</b> text <a href="https://www.artificial-solutions.com/" target="_blank">Artificial Solutions</a>
<span class="red--text">This text should be red</span>
<span class="primary--text">This text should be in the primary color</span>
<span class="secondary--text">This text should be in the secondary color</span>
<span class="text-decoration-underline">This text should be underlined</span>
<div class="elevation-3 primary white--text pa-3">This text should be white, the background should be in the primary color and all the text should have an elevation of 3. Also the div will have a 3 point padding in all directions.</div>
```

<div align="left"><img src="https://4062709520-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-La71Iy76rotlqbCOWoQ%2F-MMvFElFovDQEZN1tVzh%2F-MMvGgMC1e5J5R7M8Hld%2Fstyles.png?alt=media&amp;token=d27a335d-3222-4b1b-a420-0a31d68207df" alt=""></div>
