> ## Documentation Index
> Fetch the complete documentation index at: https://hyperframes.heygen.com/llms.txt
> Use this file to discover all available pages before exploring further.
# Annotate Cursor
> A marker pen glides onto the frame and hand-draws a loose loop, an underline, or an arrow around a region, the ink laid exactly under its nib, then lifts and leaves.
**Annotate Cursor**
```html cursor-annotate.html theme={null}
Annotate Cursor
```
Copy npx hyperframes add cursor-annotate to the clipboard
That writes one file: `compositions/components/cursor-annotate.html`.
## Paste it into your composition
Open `compositions/components/cursor-annotate.html` and copy what is inside into your own composition.
A component has no size or duration of its own. It takes both from the composition
you paste it into.
## Variables
Every one of these has a default, so the piece works untouched. Set the ones you
want to change on the element:
| Variable | Default | Accepts | What it does |
| - | - | - | - |
| `shape` | `circle` | `circle`, `underline`, `arrow` | |
| `color` | `#f43f5e` | color | |
| `target_x` | `40` | 0% to 95%, step 1% | |
| `target_y` | `38` | 0% to 95%, step 1% | |
| `target_w` | `20` | 2% to 90%, step 1% | |
| `target_h` | `16` | 2% to 90%, step 1% | |
Set them with `data-variable-values` on the element that mounts it. These are the
defaults, so this behaves exactly like the preview above until you change one:
```html wrap theme={null}
```
Tagged `cursor` `motion-primitive` `pen` `annotation` `draw-on` `highlight`.
## Related topics
* [Browse the complete Catalog](https://hyperframes.heygen.com/catalog.md)
* [Add assets and Catalog items in Studio](https://hyperframes.heygen.com/studio/assets-and-blocks.md)
* [Build a richer composition](https://hyperframes.heygen.com/go-further.md)
## Related topics
- [Vox Annotate](https://hyperframes.heygen.com/catalog/components/vox-annotate.md)
- [Multiplayer Cursors](https://hyperframes.heygen.com/catalog/components/multiplayer-cursors.md)
- [Oversized Cursor](https://hyperframes.heygen.com/catalog/components/oversized-cursor.md)
This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.