Motion graphics and HTML

Motion-graphics videos and pixel-exact layouts made from HTML: kinetic type, animated explainers, charts, title cards and social cards.

Open in ChatGPT Open in Claude Open in Codex

Part of the Creative Claw plugin as creativeclaw-render-html · 100 free credits · no subscription

What it does

Hands a brief to Creative Claw’s video agent, which writes the HyperFrames composition, makes the media and renders an MP4 with sound.
Renders HTML you already have as a PNG or a video, exactly as written.
Best for exact text, charts, UI motion, logo stings, lower thirds and end cards.
Only runs when you ask for HTML, HyperFrames or motion graphics. Photoreal footage goes to the video skills.

A real example

Swiss grid data story

A Swiss-style data story with a strict grid, animated statistics and captions, rendered from a HyperFrames template. Cost: 5 credits ($0.05). See how it was made

Try it

Use Creative Claw to make a 15-second motion-graphics video with bold kinetic typography announcing my app launch: three short lines, upbeat music and an end card with the app name.

Open in ChatGPT Open in Claude Open in Codex

Opens a new chat with the prompt ready, and offers to add Creative Claw if it isn’t installed. In Claude Code, copy the prompt into a session.

Not set up yet? Add Creative Claw to Claude, Claude Code, ChatGPT or Codex.

Typical cost

$10 buys 1,000 credits that never expire. Creative Claw can quote a generation before it runs.

What	Cost	Notes
HTML to Video (HyperFrames)	5+ credits	First 15 normalized 1080p/30fps seconds included; +1 credit per additional 15. Resolution and FPS scale the normalized duration.
HTML to Image	1 credit	Per render

The video agent holds 200 credits when a turn starts and charges only what it used once it finishes. A failed turn is free.Full pricing

Motion graphics and HTML

What it does

A real example

Try it

Typical cost

Other Creative Claw skills

You're in!