AI Toolkit · Cinematic 3D
Cinematic 3D / 10 effects, 3 free
Cinematic 3D effects that watch you back
A robot that turns its head towards your mouse, an owl that follows you, a globe of light, a flashlight in the dark. Pick an effect, play with it and copy the prompt or the code into Claude Code, Codex or your own language model.
3D robot that follows your cursor
A real 3D robot that turns its head towards your mouse, blinks and looks around when you sit still.
All effects
Every effect has its own page with the prompt, the code and an explanation of how it works.
- 01With email3D robot that follows your cursorA real 3D robot that turns its head towards your mouse, blinks and looks around when you sit still.Follows your mouse · React + three.js
- 02With emailOwl that watches your cursorAn SVG owl that turns its head and follows you with its eyes. Layered parallax gives it a 3D feel without a 3D library.Follows your mouse · React + Tailwind
- 03FreeButton with eyesA button with two eyes that follow your cursor. Come close and they open wide; click and they squeeze shut.Follows your mouse · React + Tailwind
- 04With emailHead turn from a frame sequenceThe technique behind characters that watch you: a sequence of frames you scrub with the mouse, with a crossfade between frames.Follows your mouse · React + Tailwind
- 05FreeParticle globeA spinning globe of hundreds of light points. Drag it around; points near your cursor light up and move aside.Drag · React + Tailwind
- 06With emailFlowing mesh gradientA living background on the GPU: colours that slowly flow into each other and bend around your cursor. No library, pure WebGL.Follows your mouse · React + Tailwind
- 07FreeFlashlight revealA dark hero where your cursor is a flashlight. Wherever you shine, a colourful scene and a hidden message appear.Follows your mouse · React + Tailwind
- 08With emailCinematic depth heroA cinematic layered landscape: mountains, mist, sun and birds that each move differently with your mouse. Depth without a 3D model.Follows your mouse · React + Tailwind
- 09With emailFocus reveal textA large sentence whose words sharpen one by one as you scroll, as if a camera is pulling focus.Scroll · React + Tailwind
- 10With emailGlow ring buttonA button with a glowing edge that always points towards your cursor and pulls the button slightly towards you.Follows your mouse · React + Tailwind
How to put one on your own site
- 01
Pick and play.
Every effect above is real: move your mouse, drag and scroll. Choose what suits your page.
- 02
Open it in your AI tool.
One click opens the prompt in Claude, ChatGPT, Gemini or Copilot, or starts it in Claude Code or Codex. Saving it as a file works too.
- 03
Make it yours.
Let your AI add your own character, colours and text. For a character that watches you: make a short AI video of it looking from left to right and cut it into frames.
Free, straight to your inbox
Unlock all 10 effects
You can already play with everything. Leave your email and you also get the prompt and code of the 7 locked effects. You get our newsletter on what happened in AI that week; unsubscribe anytime with one click.
- Prompt and code for all 10 effects
- Works in Claude Code, Codex, Gemini, Copilot and Cursor
- One sign-up unlocks the whole AI Toolkit
Designed and built by NinA AI Agency, inspired by the cinematic websites of scrolltide.co. Free to use in your own projects; the credit in the code shows where it came from.