TemplatesWebsitesPro

Kinetic Type Reel — 15s 9:16 GSAP

A single-file HTML motion graphic for Reels/TikTok/Shorts. It's 1080×1920, 15 s long and timed to 120 BPM (beat every 0.5 s), and uses Anton with a 2-colour palette and full-screen colour flips. The scenes are: word slams with overshoot and screen shake, letters rising through a mask, stretch/squash, a phrase that splits apart, and a CTA lock-up with an underline wipe. Edit the CONFIG block or use URL params (?l1=…&cta=…&a=…&b=…). Add ?autoplay=1 to screen-record without the button or cursor, or ?t=… to freeze a frame.

How to use it

1Copy or download the JSON.
2In n8n, open Workflows → Import from file (or paste).
3Add your own credentials and IDs, then switch it on.

The preview is free to look at. Subscribe to get the full prompt, files and code.

More like this

Scrapbook — 12s Paper-Cutout Collage Reel

Websites

Pro

Subscribe to Unlock

Scrapbook — 12s Paper-Cutout Collage Reel

A single-file HTML motion graphic built with GSAP and CSS/SVG only, no images. It runs 12 s at 1080×1350 (4:5) or 1080×1920 (?format=story). The playhead is quantised to 12 fps, and a seeded "boil" makes every take identical. Riso palette, torn clip-path edges, halftone, misregistration, tape strips and doodles that draw on. Three photo slots plus a polaroid take your own images via ?photo1..4=. Edit CONFIG or use ?title=, ?p1..3=, ?cta=, ?handle=. Add ?autoplay=1 for recording, or ?t= to freeze a frame.

Websites

Pro

Subscribe to Unlock

Neon Tapes — 8s Retro VHS Channel Intro

A single-file HTML motion graphic (Canvas + GSAP 3.12.5), 1920×1080 with a 1080×1920 toggle, 8 s long. Sequence: a blue VCR PLAY screen with OSD date, tracking-error bands, then the brand on a synthwave grid with RGB split, chromatic aberration, glitch slices and scanlines. The tagline types in, then the image warps, static bursts and it cuts to black. Persistent grain, barrel distortion, vignette and warm colour bleed. Synthesized tape hiss, hum and whooshes with a mute toggle. Edit CONFIG or use URL params (?brand=, ?tagline=, ?palette=, ?format=vertical). Add ?autoplay=1 for clean screen recording.

Pulse — 20s Animated Data-Story Explainer

Websites

Pro

Subscribe to Unlock

Pulse — 20s Animated Data-Story Explainer

A single-file HTML data-story video built with GSAP 3.12.5 and inline SVG, no chart libraries. It runs 20 s at 1920×1080 on a dark navy background with a mint accent. Six scenes morph without hard cuts: line-drawn icon, ring plus counting number, staggered bar chart, line chart drawing on with a glowing dot and peak annotation, a 7-of-10 pictogram, and a takeaway with a source credit. Edit the DATA object at the top. Use ?autoplay=1 for recording, ?t= to freeze a frame and ?accent= for colour.