A magical 3D developer toolbox
Plug WebGPU-ready materials, particles, and compute workflows into your stack without rewriting your engine.
Three.js Blocks 
Next-Gen Three.js Stack
Unleash the power of Three.js
Three.js Blocks distills a decade of award-winning 3D craft into composable building blocks so you can ship immersive worlds, games, and interactive stories with confidence.
WebGPU ready
Compute-ready nodes, materials, and physics so your scenes run silky smooth today and tomorrow.
Studio tested
Patterns battle-tested on global installations, brand activations, and realtime experiences.
Ship faster
Drop-in starters, turnkey shaders, and off-screen engines tuned for performance out of the box.
Create astonishing visuals in seconds
Award-winning effects, cinematic lighting, and animation blueprints that synchronize 2D, 3D, and motion effortlessly.
Performance obsessed foundations
Instancing, culling, LOD, meshlets, and cache-aware pipelines keep your main thread free for storytelling.
Why Three.js Blocks
Ship modern 3D worlds without drowning in boilerplate.
Building a production-ready Three.js experience means juggling performance budgets, runtime quirks, and rendering tricks. We take the hardest parts off your plate so you can focus on narrative, interaction, and polish.
- Serious performance: LOD, instancing, culling, batching, meshlets, and cache-aware pipelines from the start.
- Block by block: Mix and match materials, physics, particles, post-fx, and engine helpers to orchestrate complex scenes.
- AI friendly: Clear, documented APIs and llms.txt support so your AI copilots wire things up correctly.
- Framework agnostic: Works with React Three Fiber, Vue, or vanilla Three.js for total flexibility.
"My goal is to democratize advanced Web 3D so anyone can build vibrant worlds and games at production quality."
How it works
- 01 Install the Blocks package for your stack â
@three-blocks/r3f,@three-blocks/vue, or@three-blocks/core. - 02 Drop composable blocks into your scene and configure them with expressive props.
- 03 Leverage tuned defaults for physics, batching, and culling to hit target frame rates immediately.
- 04 Ship with the confidence that your pipeline is ready for WebGPU upgrades the moment they land.
From the author
Crafted by a team obsessed with expressive realtime worlds.
I've spent nearly a decade building high-end Web 3D, obsessing over performance and rendering techniques, and contributing to the Three.js ecosystem. After working in France and Canada, I moved to Japan and founded Utsubo five years ago, teaming up with engineers, 3D artists, designers, and sound engineers to create experiences beyond what I could ship alone.
In my Open source software journey, I've created tools like react-three-next (Next.js + @react-three/fiber starter), stats-gl (advanced WebGL WebGPU monitor tool), r3f-perf (performance tools for @react-three/fiber), and vanilla-three-starter (opinionated Three.js starter).
Three.js Blocks is my way to put expert-level features into everyone's hands-fast, composable, and maintainable. Let's make the web a place of incredible 3D worlds and experiences.
â Renaud Rohlinger, CTO @ Utsubo
Early access
Join the waitlist
Don't miss the launch. Get early access, founder notes, and an exclusive discount.
Partner with us
For businesses & brands
Ready to outperform your category with immersive 3D beyond just "expertise"? I co-founded Utsubo, an award-winning, technology-first studio based in Osaka. We're senior engineers, artists, designers, and sound engineers with 10+ years pushing the limits of browsers and large-scale installations. Explore our work at utsubo.com.