# HTML5
The HTML5 asset renders a self-contained HTML, CSS, and JavaScript page inside a video clip. Use it for animated overlays, motion graphics, data visualisations, and anything you would otherwise build as a small single-page web app.
HTML5 replaces the deprecated `html` asset, which only rendered static markup. HTML5 runs in a real browser with a JavaScript runtime, a set of preloaded animation libraries, and deterministic frame capture. Use `html5` for all new work.
## Basic usage
A minimal HTML5 asset requires `type` set to `html5` and an `html` string. Add `css` and `js` to style and animate it:
```json
{
"asset": {
"type": "html5",
"html": "{{title}}
",
"css": ".card { font-family: 'Inter'; padding: 32px; color: #fff; }",
"js": "gsap.to('.card', { x: 200, duration: 1 });"
},
"start": 0,
"length": 4,
"width": 1920,
"height": 1080
}
```
**Asset properties:**
| Property | Required | Type | Description |
| :------- | :------- | :----- | :--------------------------------------------------------------------------------------------------------------------------- |
| `type` | Yes | string | Must be set to `html5`. |
| `html` | Yes | string | The page markup. Supports [merge fields](/docs/guide/architecting-an-application/merging-data) such as `{{title}}`. Max 1,000,000 characters. |
| `css` | No | string | Stylesheet, inlined into the page ``. Max 500,000 characters. |
| `js` | No | string | Script, run after the preloaded libraries are ready. Max 500,000 characters. |
The clip-level `width` and `height` set the page's pixel dimensions and default to the output's dimensions. Every coordinate inside the page is measured in this pixel space.
## Preloaded libraries
Four animation libraries are always available. Do not add any `