Original prompt — Tested Single-file HTML kinetic type prompt
by MotionPrompts (own run)
Prompt
Banned list ✓Beat grid ✓Build method ✓Self-review ✓
<direction>
A 7-second square kinetic type film in ONE self-contained HTML file. A monospace "index.html" badge sits top-right throughout. Four words stack and slam one per beat — SINGLE FILE KINETIC TYPE. — the second word in the accent colour; an accent rule draws under the stack; the closer lands: "NO BUILD. NO BUNDLER. JUST HTML." Near-black background, white type, one orange accent.
Banned: glows, gradients, rotations for their own sake, words smaller than the frame deserves.
</direction>
<structure>
Beats at 0.3s / 1.15s / 2.0s / 2.85s: one word per beat, rising 84px with a power4 settle — a slam, not a float. Beat 5 (3.6s): rule draws left to right. Beat 6 (4.0s): closer fades up. Hold the stack to the end.
</structure>
<build>
ONE self-contained HTML file, 1080x1080 square: inline CSS, inline script, paused GSAP timeline, every frame a pure function of time. Words are absolutely positioned blocks at fixed tops, so later words never push earlier ones.
</build>
<gotchas>
Stacked words at 150px need their line-height and tops planned like a poster, not typed like a paragraph: measure the stack height before animating, or the last word lands on the rule.
</gotchas>
Before you finish: step through the timeline at five points and fix anything that overlaps, clips the frame, or drifts off the beat grid.
Four words, stacked and slammed, in one HTML file with a badge that says so. The square cut is the social version of the single-file argument.
Run log
| Model | Claude (agent build) |
| Renderer / stack | Single-file HTML + GSAP (seek-driven) |
| Iterations to final | 1 |
| Render time | 24s (final render) |
| Format | 1080×1080 · square |
| Published | 2026-10-25 |
What broke (and the fix)
- Nothing broke. All four words landed inside the square frame at 150px in the first snapshot — the stack was measured before it was animated, per the rule the Remotion kinetic-type entry taught us earlier in this wave.
Related videos