# ViewFX — Playground

> Live composition sandbox for `viewfx` theme transitions.

HTML UI: https://viewfx.luismc.dev/playground/
This markdown: https://viewfx.luismc.dev/playground.md
Home (markdown): https://viewfx.luismc.dev/index.md

## What you can do

1. Pick an effect from 31 utilities
2. Tune duration, delay, and steps
3. Play the wipe on the real View Transitions API
4. Copy the class list
5. Share the URL (query params encode state)

## Available effects

- `circle`
- `circle-blur`
- `polygon`
- `corner-tl`
- `corner-tr`
- `corner-bl`
- `corner-br`
- `iris`
- `diamond`
- `hexagon`
- `square`
- `mosaic`
- `soft`
- `heart`
- `expand`
- `split`
- `shutter`
- `ink`
- `spiral`
- `slide-right`
- `slide-left`
- `slide-up`
- `slide-down`
- `venetian`
- `glitch`
- `slide`
- `lift`
- `zoom`
- `rotate`
- `fade`
- `dissolve`

## Controls

| Control | Class pattern | Keys |
|---------|---------------|------|
| Duration | `fx-duration-{key}` | 0, 100, 150, 200, 250, 300, 400, 500, 700, 800, 900, 1000, none, slower, slow, normal, fast, faster |
| Delay | `fx-delay-{key}` | 0, 100, 150, 200, 250, 300, 400, 500, 700, 800, 900, 1000, none |
| Steps | `fx-steps-{key}` | none, retro, normal, modern |

## Related

- Package install + full docs: https://viewfx.luismc.dev/index.md
- Full agent reference: https://viewfx.luismc.dev/llms-full.md
- Source: https://github.com/luisitoluis/viewfx

---
Generated from `viewfx@0.0.8`