✦ Studio pick
Vael · 16:9
Rendered by this Skill
Cuboid Card Carousel v1.0.0
A chain of bevelled 3D cards rides a travelling wave, then one card lifts out, turns to camera and holds.
No ratings yet 0 downloads
- Format
- Video · 16:9
- Length
- 0:07
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 short content carousels. Up to twelve cuboid cards, each with a category, a title and two small pills, ride a wave through a lit 3D scene; the hero card breaks away, spins and settles face-on. Cards are set with one JSON variable, and the lights, materials and camera are variables too.
Updated Nov 2, 2026
What you get
- A 6.7-second 1920×1080 MP4 with a lit 3D card wave
- Up to twelve cards from one JSON list
- A hero card that breaks out and holds
Good fit
- Product drops and collection teasers
- Roadmaps, task lists and feature lists
- Event agendas and line-ups
Not for
- Photos on the cards (they hold text)
- Long reads; each card shows only a few words
About this Skill
You say
/cuboid-carousel Make a cuboid carousel for our handbag drop with eight cards: category "Vael Cerise", titles like "Cherry leather tote", "Brass hardware" and "Room for a laptop", pills for stock and price. End on "The Cerise tote is here".
A carousel with weight. Cuboid Carousel builds your cards as bevelled blocks with real lighting and shadows, sets them on a travelling wave and swings a handheld-style camera past them. Then the hero card you choose lifts out of the chain, tumbles and lands facing the camera for the closing beat.
How it works
- Ask: tell your agent what the carousel should say: one card per item, each with a category, a title and two pills such as a status and a date or price.
- 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
- Write card titles of two to five words; they sit on a small face.
- Choose the card you want to end on as the hero card.
- Warm key and bottom lights flatter dark cards; keep the backdrop darker than the cards.
- At 6.7 seconds it loops well in feeds; render it twice back to back for a longer cut.
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
- A list of cards: a category, a short title and two pills for each.
- 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
How many cards can I use?
One to twelve. Pass them as a JSON list in the cards variable and pick which one becomes the hero.
Can I change the look of the blocks?
Yes. Size, thickness, corner radius, bevel, body colour, roughness, metalness and every light are variables.
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, Vael.
