# HTML Template

Web Export creates the HTML needed to make the element match what is seen in Adobe XD.&#x20;

You can modify the HTML by using the [tag name](https://velara-3.gitbook.io/web-export/element-options/tag-name) and [attributes](https://velara-3.gitbook.io/web-export/element-options/attributes) fields in the Element Options form.&#x20;

You can define your own HTML in the HTML template field. &#x20;

{% hint style="info" %}
When you have an **Artboard** selected the HTML template refers the Page template. This is different than an element.&#x20;

See [Page Template](https://velara-3.gitbook.io/web-export/export-artboard-dialog/page-template).&#x20;
{% endhint %}

To replace the default HTML click on the HTML template icon.&#x20;

![](https://735683391-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LWpp_0PwLnj_AXGL2u7%2F-Mbty4ZSNRAtz8e6Yoq6%2F-Mbu6t_TzmmyLlt9FoqV%2Fimage.png?alt=media\&token=fda4cec5-5c4e-4aa6-96ee-869c273421ce)

![](https://735683391-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LWpp_0PwLnj_AXGL2u7%2F-Mbty4ZSNRAtz8e6Yoq6%2F-Mbu70yrQVL-nG88oQGi%2Fimage.png?alt=media\&token=d1e2ba52-4be0-40d1-b0b7-c244ee7f4a4f)

By default this field is empty.&#x20;

Enter the HTML you want to use.&#x20;

![](https://735683391-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LWpp_0PwLnj_AXGL2u7%2F-Mbty4ZSNRAtz8e6Yoq6%2F-Mbu7Tz3Wxwm8Q6yyFYI%2Fimage.png?alt=media\&token=5650ff37-422c-42f0-a32f-eac5d376c835)

To see what is exported click the Show Markup button.

![](https://735683391-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LWpp_0PwLnj_AXGL2u7%2F-Mbty4ZSNRAtz8e6Yoq6%2F-Mbu7av3WivHO0MEF8vH%2Fimage.png?alt=media\&token=e270e884-1b58-4daa-b212-791bf8df840c)

You may want to add token to the exported HTML. You can access a few properties and element values through tokens:&#x20;

![](https://735683391-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LWpp_0PwLnj_AXGL2u7%2F-Mbty4ZSNRAtz8e6Yoq6%2F-Mbu7N5rmSTqf0wwOHuh%2Fimage.png?alt=media\&token=375253c0-d305-41c1-94fc-78c38d4f133c)

![](https://735683391-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LWpp_0PwLnj_AXGL2u7%2F-Mbty4ZSNRAtz8e6Yoq6%2F-Mbu7uT5EqSV3zz5Bz9v%2Fimage.png?alt=media\&token=ca3bb8b4-12e0-470b-b3f6-e45a58c1c8ec)

More supported tokens:&#x20;

![](https://735683391-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LWpp_0PwLnj_AXGL2u7%2F-Mbty4ZSNRAtz8e6Yoq6%2F-Mbu8MVQCW4VXv6xyBHa%2Fimage.png?alt=media\&token=a5a805d5-72cf-4b6d-a5f7-5f22064c6299)

![](https://735683391-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LWpp_0PwLnj_AXGL2u7%2F-Mbty4ZSNRAtz8e6Yoq6%2F-Mbu8HGZ0IlWuioCFqnv%2Fimage.png?alt=media\&token=217fb0d6-ce8a-4f74-8594-bdaeccbe35b8)

Token List

![](https://735683391-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LWpp_0PwLnj_AXGL2u7%2F-Mbty4ZSNRAtz8e6Yoq6%2F-Mbu8XS4z8P4_cD2twxB%2Fimage.png?alt=media\&token=3458db6b-1e40-4c89-ae7b-a390e2add91b)

An example project showing how to use templates can be found [here](https://github.com/velara3/xd-examples/tree/master/web-export/examples/templates).&#x20;
