Prompt of the day ·
A gold 3D product that follows your cursor and spins on tap
A glossy gold knot floats in a warm glow, leans toward the cursor and does a full spin when you tap it. Real reflections from a studio environment, so the metal never goes black.
Make one index.html with three.js (import map, three@0.160 from unpkg, plus addons/ for RoomEnvironment). Full-screen page, background radial-gradient(circle at 50% 48%, #8a5a2c 0%, #3a2414 40%, #0e0b09 75%). One glossy gold product floats in the middle and fills about 70% of the screen height, fully in view on a phone: TorusKnotGeometry (radius 1, tube 0.34, 300x48) in MeshPhysicalMaterial, color #f0c987, metalness 1, roughness 0.28, clearcoat 1, envMapIntensity 2.6, lit by RoomEnvironment via PMREM plus a warm point light top left (intensity 60) so nothing turns black. It bobs gently and slowly turns. The cursor (or a finger) steers it: it eases toward the pointer, tilting up to 35 degrees, damping 0.06. Click/tap: one full spin, ease-out. ACES tone mapping, pixel ratio max 2. 60 fps on a phone.808 characters · Made with three.js 0.160 (MeshPhysicalMaterial) · 2 versions of the prompt · The post on X
What it’s for
- The hero of a one-product shop: jewellery, perfume, a watch, a bottle.
- A launch page where the product is the whole story.
- A logo in 3D for a brand’s first screen.
Variants to try
Add the line at the end of the prompt. We haven’t filmed these: try them yourself.
- Your product
Instead of the torus knot, load my model product.glb with GLTFLoader, centred and scaled to the same size. - Silver
Color #e8ecf2, roughness 0.18, background radial-gradient(circle at 50% 48%, #5a6470 0%, #1d2228 40%, #08090b 75%). - With a price tag
Under the product, a small white line "€89 — Shop now" that links to #shop.
How to use it
- Copy the prompt.
- Paste it into Claude, ChatGPT, Cursor or Lovable and ask for a single index.html file.
- Save the file and open it in your browser. To publish it, upload it to any static host (Cloudflare Pages is free).
Want it finished, with your photos and words?
The Product kit is the full version of this idea: a whole website you fill in in the browser and download.See the Product kit · €500→Or we set it up for you: send us your words and photos and we publish it at your domain within 48 working hours.
We set it up · €750→Questions
- Where do I paste this prompt?
- Into any assistant that writes code: Claude, ChatGPT, Cursor, Lovable or Claude Code. Ask for a single index.html file, save it and open it in the browser. It uses three.js 0.160 (MeshPhysicalMaterial).
- Can I use it on my website?
- Yes. The prompt is free and the code your assistant writes is yours. If you’d rather have the finished version, with your photos and words and ready to publish, there’s the related kit.
- Is the video what really comes out?
- Yes. It’s the page the prompt made, filmed without touching the code by hand; the prompt was rewritten 1 time, and this is the last one. Every assistant writes different code, so yours may vary a little.