Free
Halden Solace · 16:9
Rendered by this Skill
Liquid Glass Widgets v1.0.0
Frosted liquid-glass stat widgets count up, a showcase panel reports progress, and status chips light up over a flowing aurora.
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 seconds of liquid-glass dashboard. Three frosted widgets count up a temperature, a battery level and a step ring, a showcase panel with your logo shows a title, a sentence and a status that completes, and three status chips glow on, all over a moving aurora shader. The text, numbers and logo are edited in the HTML.
Updated Nov 3, 2026
What you get
- An 8-second 1920×1080 MP4 with a live aurora background
- Counting stat widgets, a showcase panel and status chips
- Your logo on the panel
Good fit
- Fitness, health and smart-device apps
- Dashboards and data features
- Product launch b-roll
Not for
- Plain or brand-coloured backgrounds
- More than three stats
About this Skill
You say
/liquid-glass-widgets Make liquid glass widgets for a Halden run: temperature, watch battery and 8.2K steps, with a panel "Long run saved: 18.4 km at an easy pace in the Halden Solace" that ends on "Run saved".
Widgets are how people glance at what matters. Liquid Glass Widgets builds a small dashboard in the frosted liquid-glass style, with numbers counting up and a panel that reports a finished task, so a fitness app, a smart device or a service can show its data beautifully.
How it works
- Ask: tell your agent the three widget values, the panel title and sentence, the finishing status and your logo.
- Fill: it writes your copy and colours into the block's variables, keeping text close to the length the layout was made for.
- Render: it renders a draft with
npx hyperframes render, checks a few frames and renders the final MP4. - Reuse: the variables live in one small JSON file, so the next version is one more render.
Tips
- Pick three numbers that tell one story, like temperature, battery and steps on a run.
- Keep the panel sentence to about 70 characters.
- Use a white logo.
- It has no variables: your agent edits the text and numbers directly in the HTML, following the SKILL.md.
Open source
This is a block from the HyperFrames registry, 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 and a SKILL.md written by Reelity, so your agent knows how to fill and render it; HyperFrames itself runs from npm.
What you need before you start
- You bring
- Three stats, a short panel title and sentence, a finishing status and a white logo.
- 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 the widgets show other stats?
Yes. Labels, values and units are in the HTML; the count-up animation works for any number.
Is it the same look as Liquid Glass Notifications?
Yes, the same aurora and glass, so the two cut together well.
Why is it free?
It is an open-source HyperFrames block by HeyGen and the HyperFrames contributors. We list it as it is, with a SKILL.md so your agent can use it and a sample made with one of our house brands, Halden Solace.
