Free
Halden Solace · 16:9
Rendered by this Skill
Code Slice Hero Title v1.0.0
A big headline made of tiles that flip one by one under a sweeping depth wave to reveal a second headline behind it.
No ratings yet 0 downloads
- Format
- Video · 16:9
- Length
- 0:08
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 8-second title cards. Your front headline is printed on a grid of cells; a soft depth field sweeps across, each cell flips with a little bounce and shadow, and the back headline is left standing. Both lines, the sweep direction, speed, cell size and colours are variables.
Updated Nov 2, 2026
What you get
- An 8-second 1920×1080 MP4 title card
- Two headlines with a tile-by-tile flip between them
- Variables for the sweep, timing, cell size, shadows and colours
Good fit
- Launch openers and end cards
- Claim-and-payoff lines for social posts
- Rebrands and before/after messages
Not for
- Long sentences or paragraphs
- Videos that need product footage in the title
About this Skill
You say
/code-slice-hero Use the code slice hero block for our running shoe launch: front headline "RUN SOFT.", back headline "RUN FAR.", sweep left to right. Render it at 1080p.
Two short lines, one clean flip. Code Slice Hero prints your first headline on a grid of square cells. A wave sweeps across the frame, lifting and tilting each cell as it passes, and every cell flips over to show the matching piece of the second headline. It works best with two punchy lines of the same length: a claim and its payoff, a product name and a promise, "before" and "after".
How it works
- Ask: tell your agent what the title should say: the front headline and the headline it flips to.
- 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
- Keep both lines short (one to three words) and close in length so the flip reads as one gesture.
- Change the sweep direction to match the reading direction of the next scene in your edit.
- Lower the cell size for a finer, more digital flip; raise it for a chunkier, poster-like one.
- Use it as the opening or closing card of a longer launch video.
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
- Two short headlines and, if you like, your brand colours.
- 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
Can I use my own font?
Yes. The block ships with Geist (open source); swap in any web font and adjust the font size variable so the line fills the frame.
Can the flip go right to left?
Yes. The direction is a variable, and so are the sweep duration, its easing and the flip duration.
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, Halden Solace.
