
Rendered by this Skill
Glass Shard Title v1.0.0
Iridescent glass shards fly in through fog, lock together into your headline, hold, then fly out again.
- Format
- Video · 16:9
- Length
- 0:12
Free Free with an account
Paste this into your agent. It connects the CLI if needed, then installs the Skill.
A free HyperFrames block for a 12-second luxury title. Your headline is cut into seeded glass shards rendered in 3D with an HDR studio light; they fly in from both sides, tile into the words, idle with a slight turn and leave the frame empty. Tile count, roundness, bevel, timing, chaos and fog are variables.
Updated Nov 2, 2026
What you get
- A 12-second 1920×1080 MP4 title with real 3D glass
- Your headline assembled from shards, then cleared
- Variables for tiles, bevel, roundness, timing, chaos and fog
Good fit
- Beauty, fragrance and jewellery launches
- Collection names and luxury product titles
- Openers for premium brand films
Not for
- Long taglines or body copy
- Bright, playful brands that want flat colour
About this Skill
/glass-shard-title Make a glass shard title for our perfume, "Ambre Nuit". Keep the default timing and render 1080p.
A title that looks like it was blown in glass. Glass Shard Title rasterises your headline, breaks its footprint into glass shards and renders them in Three.js with an HDR studio environment, so the edges catch real highlights. The shards fly in from the left and right through soft fog, lock into the words, hold for a beat with a slow turn, then scatter out and leave a clean frame for your next shot.
How it works
- Ask: tell your agent what the title should say: the headline, usually a product or collection name.
- Set up: it puts the block in a HyperFrames project and fills in your copy and colours as render variables.
- Preview: it checks a few frames, then renders a 1920×1080 MP4 with
npx hyperframes render. - Reuse: the variables live in one JSON file, so a new headline or a new brand is one more render.
Tips
- One to three words read best; long lines make the shards small.
- Raise the fog for a dreamier, darker look; lower it for crisp glass.
- Fewer tiles give big, bold shards; more tiles give a fine mosaic.
- Pair it with a product shot cut in right after the shards fly out.
Open source
This is a HyperFrames registry block. Made by HeyGen and the HyperFrames contributors (heygen-com/hyperframes) and shared under the Apache License 2.0. The download is the block with its assets, ready to render; HyperFrames itself runs from npm.
What you need before you start
- You bring
- Your headline (a product or collection name works best).
- Dependencies
- Node.js 22 or newer — required · FFmpeg — required
- Outside costs
- None. HyperFrames is free and open source and renders on your own machine.
- Last tested
- v1.0.0 —
User reviews
No reviews yet. Install the Skill and be the first to rate it.
FAQ
Does it need a graphics card?
No. It renders with the Chrome that HyperFrames downloads, using the GPU if there is one and software rendering if not. A 12-second render takes about a minute on a laptop.
What did Reelity change?
The glass texture that the registry normally downloads at install is included, GSAP and d3-delaunay load from the package instead of a CDN, and the 3D script now waits for the scene to be ready, which fixes black frames in headless renders.
Why is it free?
It is an open-source Skill by HeyGen and the HyperFrames contributors. We list it as it is, with a sample made by running it on one of our house brands, Maison Vey.






