---
title: "Hand-Drawn Flowchart"
description: "Wobbled boxes with handwritten labels joined by curved connectors, drawing on in sequence from a node list"
---
import { InstallCommand } from "/snippets/install-command.jsx";
## Install
That writes `compositions/hw-pipeline.html`, plus 1 supporting file under `assets/fonts/`.
## Add it to your video
It runs for 7 seconds at 1920×1080. Paste this into your composition:
```html index.html
```
Move it in time with `data-start`. Put it on a different timeline row with
`data-track-index`. See [data attributes](/concepts/data-attributes) for the rest.
## Source
```html
```
{/* hf:generated-footer */}
Tagged `handwritten` `diagram` `data-viz` `overlay`.
## Related topics
- [Browse the complete Catalog](/catalog)
- [Add assets and Catalog items in Studio](/studio/assets-and-blocks)
- [Build a richer composition](/go-further)