130 curated examples

Claude Opus 5.5 Three.js Prompt

探索用于 3D 场景、粒子、产品空间、Shader、镜头运动和互动网页动画的 Claude Opus 5.5 Three.js Prompt。

优秀的 Three.js Prompt 会定义场景层级、几何体、材质、灯光、镜头、交互和性能预算。这里的真实案例展示了如何把这七项组合成可执行需求。

Claude Opus 5.5 Three.js Prompts example 10:30

Claude Opus 5.5 on our AI coding benchmark: build a fully autonomous 3D water simulation from an empty repo - procedural mountains, rain, streams, lakes. TypeScript + Three.js, no physics engine. One prompt, zero corrections, ~21 min. 23/23 tests green. https://github.com/AiondaDotCom/ai-sim-benchmark

threejsshaderphysics
View prompt
Claude Opus 5.5 Three.js Prompts example 20:32

One prompt. One interactive camera lab. 🎥🔥 Claude Opus 5.5 generates a 3D experience where you can adjust the focus ring, move lens elements, shift the focal plane, and see real-time depth-of-field effects. AI-generated interactive 3D is getting wild. 🤯

threejsshader
View prompt
Claude Opus 5.5 Three.js Prompts example 30:21

I asked Opus 5.5 to explain gravitational lensing by building an interactive black hole lab One prompt for the first version, then a dynamic workflow to polish it for three rounds while I slept. This is what I woke up to: 5h 28m end to end, $90 at API prices https://blackhole.voxyz.ai Drag the black hole and the sky behind it bends into arcs, closing into a full ring when everything lines up Each round ran 3 agents. Two reviewers each picked 9 to 10 issues and ranked them P0, P1, P2. The third one fixed them. Round 1: 3D materials and lighting + UI and type Round 2: camera motion and interaction + science-communication design Round 3: a design director deciding whether it ships + visual QA and performance Every P0 got fixed, the rest only if worth it. When the two reviewers disagreed, it picked one and wrote down why. It backed up before each round, checked screenshots after, and rolled back anything it couldn't fix.

threejsshadercanvasgsap
View prompt
Claude Opus 5.5 Three.js Prompts example 40:35

Opus 5.5 generated this simulation of molecular orbitals in about ~20 minutes. I had to prompt for some structures and resonance but I can see the promise of instant educational simulations for any advanced topic

threejsshadercanvas
View prompt
Claude Opus 5.5 Three.js Prompts example 50:26

110k rigid bodies in real time, in a browser tab. Grab anything, fire cannonballs. Built with Claude Opus 5.5: Augmented Vertex Block Descent (SIGGRAPH 2025, Giles, Diaz & Yuksel) in WebGPU with @threejs . It's a physics solver that stays stable with huge scenes and big mass ratios. Opus 5.5 even put together this whole demo reel video just from a single text prompt in Claude Code haha 🤯 Try it: https://three-avbd.vercel.app (recorded on an M4 Max, lighter scenes run fine on older computers or on mobile) Code's here, MIT licensed. Go build something with it, have fun breaking things: https://github.com/sbobyn/three-avbd #threejs #WebGPU

threejscanvas
View prompt
Claude Opus 5.5 Three.js Prompts example 60:34

Asked claude Opus 5.5 to make an explainer on how a mechanical keyboard works. It wrote the music in code, used real switch recordings as the beats, built the 3D in @threejs and timed every cut to the beat. No stock footage. no editing app. What a time to be alive!

threejssvgaudio
View prompt
Claude Opus 5.5 Three.js Prompts example 70:44

I TRIED MAKING A 3D MOTION GRAPHIC WITH CLAUDE OPUS 5.5. THIS IS WHAT CAME OUT. The idea was simple: start at my desk and don't stop zooming until we hit a single atom inside the CPU. Opus 5.5 took it and just kept going. Into the PC case. The cooler lifts off. The CPU under it. The metal lid comes off. Then the silicon die, one core, the copper wiring stacked on top, rows of logic cells, the fins and gates of the transistors… …all the way down to one silicon atom, bonded to its four neighbours. One continuous shot, no cuts. The ruler on the right tracks the scale the whole time: from about a metre down to about 2 nanometres. And the part that still gets me: every frame of this is 3D rendered right in a browser, from code. No Blender, no After Effects, no stock footage. A year ago this would have been a studio job. Now it's one conversation. Opus 5.5 is on another level.

threejsshader
View prompt
Claude Opus 5.5 Three.js Prompts example 81:00

From Cabo da Roca to observable universe. I gave opus 5.5 old prompt I prepared for Fable but I was not satisfied with the results. I asked model to create a cinematic film that zooms out from a hillside on Earth to the full observable universe using @threejs No external assets. Time: ~3h Output tokens: 662,769 Cache: 125.6M read, 2.0M written; API-equivalent cost: about $54.52: output $13.26, cache reads $25.12, cache writes $16.14

threejsshadercanvasparticles
View prompt
Claude Opus 5.5 Three.js Prompts example 90:38

I asked opus 5.5 in @agnt_gg for the most realistic fire it could build using ONLY javascript. It wrote a real 3D fluid simulation that runs on the GPU. The flame colors come from blackbody physics, the smoke is real volume, it runs at 96 fps in 1080p, and it critiqued its own renders about 40 times. Then it shot a 38 second film of it. The sound comes from the fire itself. 🔥 Details: - Nothing faked. The fire is actual simulated gas that burns, heats up, rises, and swirls. It gives off soot that glows, and the soot that escapes cools into smoke. Every frame is computed on the GPU. - The AI graded its own work: render a frame, have a vision model pick it apart like a VFX supervisor, fix it, repeat. It caught a flame that kept dying, ring shaped artifacts on the ground, and coals that looked like cheese chips. - The film isn't screen recorded. Each frame is rendered offline with scripted camera moves. The crackle and roar come from how brightly the fire burns in each frame. - No Blender, no stock footage, no sound library. One HTML file, one conversation.

threejsshaderaudio
View prompt
Claude Opus 5.5 Three.js Prompts example 100:34

I asked Claude Opus 5.5 to explain how a rocket engine works by building an interactive Raptor 3 you can take apart in your browser. Cut it open, follow the oxygen and the methane through both turbopumps, then throttle it and watch the shock diamonds move. http://airsup.ai/rocket-engine

threejsshader
View prompt
Claude Opus 5.5 Three.js Prompts example 110:22

Opus 5.5 just turned a smartphone into a 20-second trip from glass to atoms. It starts on the phone, dives through the motherboard and chip, then keeps going through the semiconductor structure until you’re basically staring at the atomic scale. This is the kind of 3D shot that normally looks like a whole studio touched it. Instead, Opus 5.5 built the sequence. That’s fucking ridiculous.

threejsshadercanvas
View prompt
Claude Opus 5.5 Three.js Prompts example 120:43

I asked Claude Opus 5.5 to explain how a fusion reactor works by building one you can take apart in your browser. Drag the plasma from 15 million °C, the heat of the Sun's core, to 150 million and watch a city light up. https://airsup.ai/lab

threejsshader
View prompt
Claude Opus 5.5 Three.js Prompts example 130:32

I asked Opus 5.5 again for an engine you can take apart in the browser Pistons against magnets at the same shaft speed. Push the RPM, open the cylinders, slow time down to 1/10 Under 15 minutes, and it did not even move the usage meter on my Max plan. The first experiment took half an hour, this one reused the framework the earlier ones built This is a screen recording, the real thing runs live in your browser Next I want to find where it breaks, so a game is coming

threejsshadercanvas
View prompt
Claude Opus 5.5 Three.js Prompts example 140:10

刷到很多用opus 5.5生成的酷炫视频 为啥我用opus 生成的视频满满的像素感 大家都是怎么生成的?

threejsshadercanvas
View prompt
Claude Opus 5.5 Three.js Prompts example 150:21

最近用 GPT 6 Astra、Opus 5.5 做了一堆 web 3d 的项目,游戏、室内、Fx、文旅、整活的都有尝试hh 我把这些项目的全部工作流与prompt都整合到了线上的workplace里,之后也会持续更新,感兴趣的朋友可以收藏一波hh

threejsshader
View prompt
Claude Opus 5.5 Three.js Prompts example 160:13

✨审美绝了!Opus 5.5 用 Three.js 把宫崎骏《红猪》经典空战复刻出来了! 只给了这一句prompt: 「用 web3D 复刻宫崎骏《红猪》日落海面上的经典空战:白绿红涂装战斗机、紫色积云、海面反光、吉卜力运镜,画面写 just breathe.」 建模、配色、云层、尾迹和镜头全部一次对齐,审美直接封神。 #Opus5_5 #宫崎骏 #红猪 #ThreeJS #Web3D #AIGC #vibecoding #审美天花板 #3D #AI #Dario #Anthropic https://x.com/nft_chen/status/2103401780117938683?s=46

threejsshadercanvas
View prompt
Claude Opus 5.5 Three.js Prompts example 170:50

I asked Opus 5.5 to generate a realistic 3D model of the Taj Mahal Dome, minarets, marble inlay, even the foundations. One prompt ⤵️ One HTML file.

threejsshadercanvas
View prompt
Claude Opus 5.5 Three.js Prompts example 180:08

Claude Opus 5.5 just one-shotted an entire 3D virtual studio in Blender. We used to sell studios like this on Envato. Built in After Effects + Element 3D, each one took our team months. This took one prompt. @claudeai @AnthropicAI @alexalbert__ @bcherny

threejscanvas
View prompt
Claude Opus 5.5 Three.js Prompts example 190:59

Claude Opus 5.5 is absurdly good at 3D. I reran one of my recent 3D experiments with Claude Opus 5.5. Same prompt, same references, same real-world scene I had previously built with GPT-6 Astra. The result was much better than I expected. Put simply, for this specific use case, Claude Opus 5.5 was a clear win for me. The biggest differences for me were instruction following and taste. With the same references, Opus 5.5 got much closer to the Zelda Breath of the Wild-style look I was aiming for. The layout felt more intentional. It picked better camera angles. Asset placement made more sense. And I spent much less time fixing basic mistakes. In my Astra version, I had to repeatedly correct things like tree roots not touching the ground, rough geometry being used where proper assets already existed, or objects being placed in ways that just looked wrong. Opus 5.5 got much more of this right on its own. The interesting part for me is that I have almost zero real 3D skills. I mostly give references, look at the result, explain what feels wrong, and keep iterating. With better instruction following and visual judgment, that loop becomes dramatically easier. Still plenty to improve, especially indoors. Next test is whether I can recreate the interior of the house with the same level of quality.

threejsshader
View prompt
Claude Opus 5.5 Three.js Prompts example 200:22

OK so Opus 5.5 SMOKED GPT Astra at 3d modelling this stadium from old plans and reference pics This was a near one shot. 1000x better than Astras one shot (check reply for Astra’s one shot) I gave them the same prompt and the exact same reference plans 👇🏻

threejscanvas
View prompt
Claude Opus 5.5 Three.js Prompts example 210:41

Opus 5.5 building a website for a drink brand. -It generated all the svgs -Built the can in 3D -Painted its own labels and then rendered those to make product photo variations All this in a single (albeit, beefy) prompt

threejscanvassvg
View prompt
Claude Opus 5.5 Three.js Prompts example 220:34

Opus 5.5 does a great job in eval of GLSL (OpenGL Shading Language) in threejs. The prompt here is roughly. A fishbowl with reflection, refraction and water caustics. Check it out yourself! And compare it to other models https://threejseval.com/gallery?eval=fishtank

threejsshadercanvas
View prompt
Claude Opus 5.5 Three.js Prompts example 230:36

Opus 5.5 turned one sentence into a 3D system that opens in Blender, rigged, textured and ready to animate. It does not render the object. It constructs it, part by part, the way a modeller would if they had a week. > PARSE - the sentence becomes a parts list with real dimensions, nothing implied > MASS - each part built as clean geometry, quads only, no sculpted mush > RIG - joints and pivots placed where the object physically bends > SKIN - materials assigned per surface, scale and roughness set separately > PACK - exported with a named hierarchy, so a human can edit one part Image models stop at the render. What you get is a photograph of a thing that does not exist as a thing. That gap appears the second someone wants to move an arm, swap a material, or send it to a printer. Rigging is what nobody automates. Without pivots you have a statue, and a statue cannot be a system. Topology beats detail every time. A dense mesh looks stunning in a screenshot and folds the moment it deforms. Names carry through the whole export. Every part, joint and material reads the way a person would label it. Studios burn days on modelling and cleanup before anyone gets to the creative part of the job. The prompt format and what each stage returns are laid out underneath.

threejsshader
View prompt
Claude Opus 5.5 Three.js Prompts example 240:24

threejs (@threejs) + Claude Code Opus 5.5 tek prompt ve çıktı

threejs
View prompt
Claude Opus 5.5 Three.js Prompts example 250:42

Esta app probó 3,932 posiciones de una cama matrimonial hasta encontrar dónde cabe. La hizo Claude Opus 5.5 con un prompt mío: cuarto de 3.00 x 3.40 m, puerta de 80 cm, un clóset de 1.20 x 0.60 y la cama de 1.40 x 1.90. Armó el plano a escala y el cuarto en 3D al lado, y los dos se mueven juntos. Si la cama choca con el clóset, no deja abrir la puerta o te deja menos de 60 cm para pasar, te avisa. Solo 108 posiciones no tenían ningún problema. La mejor deja 70 cm para pasar por cada lado. Tardó 47 minutos, más 5 para pasarla a inglés, y no le corregí nada. Para una mudanza, esto dice más que cualquier benchmark.

threejscanvassvggsap
View prompt
Claude Opus 5.5 Three.js Prompts example 260:15

Opus 5.5 is good at 3d motion too apparantely

threejsshadercanvas
View prompt
Claude Opus 5.5 Three.js Prompts example 270:48

Claude Opus 5.5 یه انیمیشن 3D دیوونه‌کننده ساخته از دیتاسنتر شروع می‌شه، وارد سرور می‌شه، کارت گرافیک رو باز می‌کنه، داخل چیپ می‌ره، از مدار و ترانزیستور رد می‌شه و تا اتم سیلیکون می‌رسه. همه‌ش توی یک فایل HTML واحد اجرا می‌شه و حدود ۱ ساعت طول کشیده.

threejsshadercanvas
View prompt
Claude Opus 5.5 Three.js Prompts example 280:25

Opus 5.5 is mind boggling. It created this 3D website from just one prompt. Told it to create a website for forest conservation agency with pinterest post as reference for 3D animation. It one shotted into a single html file.

threejsshadersvgparticles
View prompt
Claude Opus 5.5 Three.js Prompts example 290:20

I wanted to see if beautiful destinations could become playable 3D experiences. Annecy, France became the prototype: a boat journey through canals, bridges, waterfront, and the mountain lake, built with Claude Opus 5.5 using Three.js + TSL. I trimmed the navigation footage for the sake of keeping the video short and the post below below has a slightly longer version. The whole workflow behind this is simple:- - Explained the concept to Opus and asked it to list some ideas. - Shortlisted one and asked it to generate a prompt, with tech stack directions. - Thats it, needed few iterations and is still a work in progress with few issues needing ironing. - The audio effects were added by Opus itself.

threejsshader
View prompt
Claude Opus 5.5 Three.js Prompts example 300:23

New Black Clover chapters are on the way and Opus 5.5 just dropped, so I put it to the test: A 3D diorama of the Black Bulls hideout, made with Opus 5.5 + three.js Every visitor is a floating mana light, come say hi to Nero 👋 https://ribes.cc/hideout/ #BlackClover #threejs

threejs
View prompt
Claude Opus 5.5 Three.js Prompts example 310:06

Opus 5.5 put London in a snow globe 🕰 Elizabeth Tower with lit clock faces 🚌 Red double-decker 🚕 Black cab at a zebra crossing ☎️ Phone box 🍂 Leaves that swirl when you shake the phone ~700 lines of Swift. No 3D files.

threejsshadercanvas
View prompt
Claude Opus 5.5 Three.js Prompts example 320:30

I gave my Claude Code sessions an office. Workspace turns each session into a desk in a 3D office: see who's working, who's done and who needs you, jump into any terminal, and let them work together. Open source, built entirely with @claudeai Opus 5.5.

threejscanvassvg
View prompt
Claude Opus 5.5 Three.js Prompts example 330:10

Claude Opus 5.5 continues to amaze me. Claude Opus 5.5 created a 3D printable enclosure for an existing PCB. Then it created this promo video for it. The PCB, the printable STLs and this animation are 100% just from prompting in Claude Code.

threejscanvassvg
View prompt
Claude Opus 5.5 Three.js Prompts example 340:42

Latentown just went 3D 🏙️ The pixel town grew into a living city of AI news. Every story is a building, every lab has a tower, and couriers carry the day's news across the river. Built over a weekend with Claude Code + Opus 5.5 and three.js. https://latentown.lol

threejsshader
View prompt
Claude Opus 5.5 Three.js Prompts example 350:29

Rok temu próbowałem zrobić grę 3D z Opusem 4.1 - zrzut ekranu, jak to wtedy wyglądało, wrzucę w komentarzu. Zobaczcie, jak szybko to wszystko idzie do przodu. Minęło tylko 12 miesięcy, a dziś wygląda to tak. Całość zbudowana z modelem Opus 5.5. https://kreatio.pl/brokul

threejsshadercanvas
View prompt
Claude Opus 5.5 Three.js Prompts example 360:28

CLAUDE OPUS 5.5 MADE ME A MAGIC EYE. It doesn't just look around. It listens. 72 plates wrapped around a mechanical eyeball, a 9-blade iris, a lens that slides out when the bass hits, two rings orbiting it like it's its own little planet. Play a track and it comes alive. Every kick flips the plates open. The bass pushes the lens forward. The highs light up the glowing core inside. When the song drops into the breakdown, the eye closes and goes quiet, like it's thinking. Then the drop hits and it blows wide open. Opus 5.5 listened to the track first, found the tempo, the breakdown and the drop, and built the whole thing around it. Even the panel on the right is live: every slider moves with the music. All 3D, all code, rendered right in a browser. Turn the sound on.

threejsshadersvgaudio
View prompt

Prompt anatomy

How to write a better prompt

  • 明确相机类型、初始位置和运动路径。
  • 描述材质的物理属性,不要只写颜色。
  • 加入移动端降级方案和目标帧率。

FAQ

这些 Prompt 可以用于 Claude Opus 5.5 以外的模型吗?

可以。这些案例采用可迁移的创意规格写法。保留场景、运动、镜头、时序和技术约束,再按模型或编程 Agent 的输出格式调整即可。

高质量 AI 视频 Prompt 应包含什么?

实用的 Prompt 会明确主体、视觉系统、动作顺序、镜头行为、时长、转场和交付约束。具体动词和可衡量时序通常比模糊的风格词更有效。