> 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/icons.md).

# Icons

You can render any Material Design Icon in a specific location of the response text. You can optionally choose the color of the rendered icon.

<div align="left"><img src="https://4062709520-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-La71Iy76rotlqbCOWoQ%2F-MMvB7OG1GMMZGGw_aqy%2F-MMvD37skIrbV7In-eQ5%2Ficons.png?alt=media&amp;token=596bd43d-caa3-4b15-94ea-d5753f6b2062" alt=""></div>

## Markup Syntax

Leopard renders the icons in a format compatible with Vuetify. That HTML is too explicit and lengthy and not ideal for those maintaining the text responses in Teneo Studio. To simplify the addition of icons the following syntax is used.&#x20;

```
[[i|mdi-icon-name|optional-color]
```

{% embed url="<https://materialdesignicons.com/>" %}

Here's some code that produced the response icons above.

<div align="left"><img src="https://4062709520-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-La71Iy76rotlqbCOWoQ%2F-MMvB7OG1GMMZGGw_aqy%2F-MMvEp1M4QHG_kFFe2eZ%2Ficons-markup.png?alt=media&amp;token=f3de8c89-5272-4f79-95ad-f5b1be373a90" alt=""></div>
