> ## 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.
# Marquee Select Cursor
> A cursor drags a selection rectangle across a photo grid; each tile rings and pops a check the frame the rectangle touches it, while a pill counts the selection up.
**Marquee Select Cursor**
```html cursor-marquee-select.html theme={null}
Marquee Select Cursor
Summer shoot
12 photos, edited yesterday
```
Copy npx hyperframes add cursor-marquee-select to the clipboard
That writes one file: `compositions/components/cursor-marquee-select.html`.
## Paste it into your composition
Open `compositions/components/cursor-marquee-select.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 |
| - | - | - | - |
| `accent` | `#0a84ff` | color | |
| `start_x` | `20.5` | 0% to 100%, step 0.5% | |
| `start_y` | `25.5` | 0% to 100%, step 0.5% | |
| `end_x` | `57` | 0% to 100%, step 0.5% | |
| `end_y` | `52` | 0% to 100%, step 0.5% | |
| `pill_label` | `selected` | string | |
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` `select` `marquee` `grid` `product-demo`.
## 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
- [Text Select Cursor](https://hyperframes.heygen.com/catalog/components/cursor-text-select.md)
- [Perspective Marquee](https://hyperframes.heygen.com/catalog/components/perspective-marquee.md)
- [Multiplayer Cursors](https://hyperframes.heygen.com/catalog/components/multiplayer-cursors.md)
This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.