One prompt, ten styles
Every clip below came from the same prompt. Only the style line changed. Sent once, no edits.
01 Synthwave 02 Paper Cutout 03 Neon Sign 04 Crayon Drawing 05 Thermal Camera 06 Watercolor 07 Matrix Code 08 Stained Glass 09 Blueprint 10 Art Deco
The prompt
Pick a style, tap Copy, paste it into the chat. That is the whole trick.
1. Pick a style
2. Copy and paste
Create one self-contained HTML file that plays a 6 second looping animation in a 9:16 frame (a 1080x1920 canvas scaled to fit the window, black outside it). Draw everything in code: no images, no external files. For a 3D style you may load three.js from cdnjs.cloudflare.com; nothing else external. Scene: what if a baby dragon took its first flight? One baby dragon flies over a cosy little town. Make the dragon cute: a chubby round body, one smooth rounded head with a short snout and no separate nose bulb, calm almond shaped eyes with heavy lids and small brows, a closed confident little smile, stubby horns, little wings flapping hard. Make it cool, not goofy: a confident swoop across the frame, a puff of sparkly smoke trailing off its tail, the town below with tiny people, sheep and birds looking up at it. Style: 1980s synthwave, a neon magenta and cyan grid horizon, a striped setting sun, chrome highlights, glow and haze. Commit to this style completely: palette, shapes, line, texture, lighting and the way things move should all feel like it. Motion: smooth, driven by requestAnimationFrame, a gentle camera drift, at least three layers of parallax, something moving at every moment, and a seamless loop every 6 seconds. No text on screen. Reply with only the HTML file.
Not into dragons? Change the Scene paragraph to animate anything: a cat surfing a wave, a rocket over your home town, your product on a turntable. Keep the cute and cool details, they make the result better. Leave the first and last paragraph as they are: they make the loop work.
Step by step
-
Open Claude or ChatGPT
Go to claude.ai or chatgpt.com and start a new chat.
Tip Free accounts may work. A paid plan is faster and handles long answers better.
-
Pick, copy, paste, send
Pick a style above, tap Copy, paste it into the chat and send it.
Tip It can think for several minutes. The answer is one HTML file, so let it finish.
-
Preview it
In Claude the HTML shows up as an artifact you can watch right in the chat. In ChatGPT open it in the canvas preview if it shows one.
Tip No preview? Copy the code into a file named dragon.html and open it in your browser.
-
Black screen or an error?
Type "fix the error" in the same chat, or simply send the prompt again in a new chat.
Tip That is normal. In our test 2 of the 10 styles needed a second try.
-
Turn it into a video
Make the browser window tall (or use your phone) and screen record about 6 seconds: on a Mac press Cmd+Shift+5, on Windows press Win+Alt+R (Xbox Game Bar) or use the Snipping Tool's record, on iPhone or Android use the built-in screen recorder. Then crop it to 9:16 in the Instagram editor or CapCut.
Tip It loops every 6 seconds, so any 6 seconds work.
-
Post it
Post the loop on its own, or put several inside your own reel the way Jan did: one prompt, ten styles.
Tip Run the same style twice and keep the better one. Every run is a new drawing.
Questions
Why does it take minutes?
The chat writes a whole animation program from scratch, often hundreds of lines of code, and plans it before it writes. A few minutes is normal. Keep the tab open until it is done.
Does it cost money?
The prompt and this tutorial are free. Claude and ChatGPT both have free plans you can try. Free plans have limits and may stop long answers early, so a paid plan works more reliably. There is nothing else to buy or install.
Can I use it commercially?
The animation code the chat writes for you is yours to post, edit and use. Check each tool's terms for the details that apply to your plan.
Can I change the subject?
Yes. Rewrite the Scene paragraph with anything you like and keep the rest of the prompt. Pick a style above or type your own with "Write your own".
Why does my dragon look different?
Every run is a new drawing. The same prompt gives a different dragon each time, even in the same style. Send it again for another take, or tell the chat what to change, for example "make the dragon bigger".