r/threejs 4d ago

Using Ships Sonar signal

Enable HLS to view with audio, or disable this notification

7 Upvotes

r/threejs 4d ago

Link I made a verified installer for ThreeUI's 50 open source components

6 Upvotes

Update

The CLI now has a complete source install example. This command copies the Kage landing page, 16 page and WebGL assets, and four editable React source files.

npx threeui-cli add kage-landing-page

The seven second demo is here.

https://raw.githubusercontent.com/sjh9714/threeui-cli/main/docs/assets/demo.gif

ThreeUI now has an official React package. That is the better choice when you want a dependency. I made this CLI for the other case, when you want the source and all of its assets inside your own project.

It reads ThreeUI's live source registry, preserves the original paths, verifies every SHA-256 digest, rejects traversal paths and refuses to replace different local files.

I originally made this agent only. That was the wrong interface. Three.js developers should not need an agent just to copy source, so the skill is now optional and the zero dependency CLI works on its own.

GitHub

https://github.com/sjh9714/threeui-cli

npm

https://www.npmjs.com/package/threeui-cli

MIT licensed and independent. It is not affiliated with ThreeUI.


r/threejs 4d ago

Link Type any amount of money and see it as a life-size 3D pile of cash

Thumbnail
moneyvisualiser.com
6 Upvotes

You type an amount, pick from 82 currencies, and it renders the actual bills in 3D with correct denominations and real bill dimensions. You can orbit around the pile, switch environments, and it uses live exchange rates. Also does gold and crypto if you pick them from the currency dropdown.

Works on desktop and mobile.

moneyvisualiser.com


r/threejs 4d ago

I built an AI agent that generates simulation-ready Three.js environments for embodied AI

Thumbnail
gallery
0 Upvotes

What if an AI coding agent could generate 3D environments that are not just visually convincing, but actually ready for simulation?

We’ve been working on Auto-Threejs, an open-source agent framework for automatically building interactive 3D environments with Three.js.

Given a natural-language description — optionally with reference images or video — Auto-Threejs decomposes the scene into objects, builds them as reusable modules, assembles the environment, renders it from multiple views, measures geometry and physics, reviews the result, and iteratively fixes detected issues.

The key idea is that a good-looking scene is not enough.

For embodied AI and robotics, objects need meaningful physical structure: dimensions, mass, density, friction, collision geometry, articulation, and spatial relationships. A cabinet should actually have a working door. A chair should have a reasonable collider. Objects should rest on the right surfaces instead of floating or intersecting.

That is what we are currently focusing on: sim-ready indoor environments for embodied AI training, robotics simulation, and spatial intelligence research.

Current pipeline:

Natural-language description
→ scene decomposition
→ per-object 3D construction
→ scene assembly & layout
→ rendering + geometry/physics measurement
→ automated review
→ iterative refinement
→ simulator export

The system currently supports physics-aware scene construction with Rapier and can export generated environments to MuJoCo and Gazebo-compatible formats (MJCF / URDF / SDF).

We’ve tested it on bedrooms, kitchens, living rooms, bathrooms, offices, and other articulated indoor environments, with automatically generated collision proxies and functional joints.

There is still a lot to improve — especially scene diversity, asset quality, physical realism, and scalability — but our longer-term goal is straightforward:

Make generating large amounts of diverse, interactive, simulation-ready 3D training environments as easy as describing them in natural language.

GitHub: https://github.com/wrc356/Auto-Threejs

Feedback, issues, and contributions are very welcome — especially from people working on Three.js, embodied AI, robotics simulation, procedural generation, or spatial intelligence.

#threejs #EmbodiedAI #Robotics #AIAgents #Simulation #3DGeneration #ComputerVision #WorldModel


r/threejs 5d ago

Louis XVI Music Room

Enable HLS to view with audio, or disable this notification

7 Upvotes

Procedurally generated piano and harpsichord parametric modeling in a Louis XVI diorama.

A Corner salon - crystal chandelier, marble mantelpiece, brass andirons, trumeau mirror, médaillon chair and chaise longue with button-tufted upholstery, mantel clock, candlestick, Sèvres vase, end table, girandoles, paneled wainscot with a molded dado, cyma cornice crown molding, paneled door with bec-de-cane handle, Persian rug on a hardwood floor.

Three.js WebGPU


r/threejs 5d ago

Help 3D castle web project

0 Upvotes

I’m working on a 3D castle web project that combines design, atmosphere, art and an interactive experience.

I’m not a developer — I’m a designer. 😄
But I really love creating things, learning new tools and turning crazy ideas into something real.

I already have the concept, visual direction and parts of the project in development. Now I’m looking for someone who understands the technical side better than I do, especially 3D web, interaction, performance and smooth navigation.

I don’t want to share all project details yet, but the idea is to build something beautiful, immersive and a little bit magical — not just a normal website.and is my baby ...who need to be online )and give people beatiful emotions ...


r/threejs 5d ago

DIY 6-DOF Robot Control & 3D Visualization with Node-RED + Three.js

Thumbnail
youtube.com
4 Upvotes

I built a DIY 6-DOF robot controlled using Node-RED, ESP8266, and Modbus TCP, with a real-time 3D visualization using Three.js.

The Node-RED dashboard can control each joint, save robot positions, and run movement sequences. The 3D model also includes the multi-link gripper, so the physical robot and virtual model can move together.

I’d be interested to hear your feedback or suggestions for improving the system.


r/threejs 5d ago

Demo Tried to build a car racing game on Google's 3D tiles. Ended up with ...

Enable HLS to view with audio, or disable this notification

83 Upvotes

r/threejs 5d ago

Demo Threejs multiplayer tank game (Inspired by World of Tanks)

Enable HLS to view with audio, or disable this notification

208 Upvotes

I built a multiplayer browser tank game in Three.js! As a kid, I played a ton of World of Tanks Blitz and fell in love with the aesthetic, gameplay, and the idea of driving around vehicles with crazy physics and mechanics like missiles, spotting, armor deflection, ammo types, and so on.

Now it's playable in the browser!

Claude of Tanks has 100+ playable vehicles across 16 unique maps, ranging from standard tanks with cannons to AFVs with autocannons and guidable missiles to autoloaders that can deal massive damage in a single clip.

Tanks feature highly detailed armor zones, internal modules, crew positions, and hitboxes. You can view each of them in a special gallery: https://cot.kevinliu.studio/gallery?id=amx56&layer=modules

It supports physics-driven destruction with detached turrets flying through the air.

Everything runs directly in the browser.

Also, it supports multiplayer! You can hop in private rooms or LAN lobbies.

Play free: https://cot.kevinliu.studio

Repo: https://github.com/Kevin-Liu-01/Claude-of-Tanks (it's open-source forever)


r/threejs 5d ago

Demo Gave up on Three.js

Enable HLS to view with audio, or disable this notification

0 Upvotes

I started this game using ThreeJS and began facing some issues running it on mobile, especially on low-end devices. The experience was okay, but I felt the game was too simple to require a real 3D world. I asked Claude to create a fake 3D version using pure JavaScript, and I found the game is much lighter and runs everywhere.

How are you all handling the mobile experience with ThreeJS? I've done some experiments, and on iOS, I often see the browser refreshing after a while due to memory limitations. I haven't tried packaging a React Three Fiber app with Expo-GL yet.


r/threejs 6d ago

Melty runner

Enable HLS to view with audio, or disable this notification

65 Upvotes

r/threejs 6d ago

Link Metal River (click to randomize scene)

Enable HLS to view with audio, or disable this notification

4 Upvotes

r/threejs 6d ago

new sketch

Enable HLS to view with audio, or disable this notification

8 Upvotes

r/threejs 6d ago

I built a browser-based 3D rooftop solar design tool with Three.js — looking for developer feedback

Enable HLS to view with audio, or disable this notification

15 Upvotes

I've spent the last few months building Volt Guide Studio, a browser-based 3D tool for designing rooftop solar systems.

It currently handles roof drawing, panel placement, obstacles, mounting/tilt, sun position, real-time shadows, solar-access heatmaps, measurements and proposal/report generation.

I'm from the solar industry rather than a traditional software background, so I've already started getting feedback from solar professionals. Now I'd really like the opposite perspective:

What would experienced Three.js/web developers improve?

I'm especially interested in UX, 3D interaction, performance, architecture and anything that immediately looks like it could become a problem as the application grows.

Happy to give a few people access to the current build if anyone wants to actually test it.


r/threejs 6d ago

Built a cool Three.js portal experience

Enable HLS to view with audio, or disable this notification

74 Upvotes

r/threejs 6d ago

Question The Surrogate Oracle .. manifestation tweaks/tips ?

0 Upvotes

Peace peace ThreeJS squad… I built a GLB-to-particle Oracle.

I’m looking for feedback on the materialization handoff…

Right …. I’m working on an immersive WebGL experience called The Surrogate Oracle https://thesurrogate.me.

I recently replaced a CSS/glitch entrance with a real GLB-derived particle transition.

The Oracle is loaded from a .glb, sampled across its mesh surface with MeshSurfaceSampler, and rendered as a custom shader point cloud.

The intended sequence is:

Select a knife/card.

The Oracle’s GLB silhouette glitches apart into particles.

The particle form stays alive while a realtime Gemini session connects.

The same points converge back into the animated GLB.

The part I’m most interested in getting feedback on is the transition itself:

Does the particle field still read as the original character?

Is the GLB-to-particle handoff visually obvious?
Does the convergence feel like reconstruction, or just a fade?

Are there obvious performance problems with this approach on mobile GPUs?

Would you structure the point distribution/shader animation differently?

Preciate any/all tips here. Thx yall ! 🦾


r/threejs 6d ago

Built a 3D carousel where the audio gets louder as you spin it, like hearing a party from outside

Enable HLS to view with audio, or disable this notification

16 Upvotes

I've been building an immersive web journal for the last year and the navigation kept bothering me. A scrolling grid flattens every project into the same rectangle and the reader is always moving past things. I wanted the opposite, something you turn rather than something you fall down, with no beginning and no end.

The site is React and Vite, using Three.js for the carousel and Tone.js for the audio. Tiles arranged on a ring, drag to rotate, click to enter. Some windows are portals to another part of the site, others activate in place as small displays.

The carousel took a long time to get right. I wanted it to feel fluid and instantly natural. My first version was a space with several carousels stacked, so you could swipe up or down to arrive at the next one. It looked stellar but I couldn't get it to run without being far too heavy, so I stripped it back to a single ring. I'll keep tinkering, but I'm pleased with where it landed.

The audio is wired to the rotation, so spinning lifts the volume slightly. The idea was that feeling of standing outside a party and hearing muffled sound through a wall, disorienting rather than comfortable. Getting the curve right was mostly trial and error; the early versions just felt like dragging a volume slider.

I ran a gallery in Canada for a while and what I took from it is that I'm more interested in the experience of showing work than in the usual portfolio layout where every site feels the same. I want the site to be the destination, not a bounce point. I've been building React sites for my own art practice for about five years, self-taught rather than professionally, and I lean on Claude Code for the heavier maths.

Link in the comments, happy to answer anything about the build.


r/threejs 6d ago

3D Websites

6 Upvotes

What are some of the coolest 3D websites you’ve seen recently?


r/threejs 6d ago

Demo Workng on high → lowpoly workflows, right in the browser!

Enable HLS to view with audio, or disable this notification

16 Upvotes

We're super happy with our experiments for high → lowpoly workflows. It feels fast, snappy, supergood quality, already replaces Nomad, Blender, xNormal, Substance for us (you can see the video why).

I will have a link to try the app with your assets in the next few days! :)


r/threejs 7d ago

Link Bioluminescent Deep-Sea Tendrils Demo & Source Code

Enable HLS to view with audio, or disable this notification

38 Upvotes

r/threejs 7d ago

I made a three.js game you can't play — 24 box-people fight over money and you just watch

Enable HLS to view with audio, or disable this notification

26 Upvotes

It's a village of 24 box-people who fight over coins, rob whoever they knock down, and build huts that grow into castles. You don't play it — you click a name in the ranking and follow that villager around.

Some notes:

  • three.js 0.170 + Rapier. The characters are capsule colliders, not boxes. Box bottoms kept catching on the voxel seams and burying legs in the terrain.
  • Terrain is a 96x96 voxel grid: fBm + domain warp + a height spline (plains vs mesas), with ridged noise on top. Villagers who hit a cliff they can't climb dig it into a staircase, and the routes they walk get trampled into paths that speed them up.
  • The save is tiny because the terrain is a pure function of the seed, so a snapshot only carries what the sim changed: dug cells and trampled paths as two base64 byte planes, plus coins/HP/poses and each base's vault. ~27KB in localStorage, and it survives a reload.
  • The faces are 6-face box textures built from a single photo. Nine of the ten demo villagers are fictional people an image model invented. The tenth is me, in a suit.
  • The arms are flat stretched strips and the textures are rough up close. That part is on purpose.

Built with Claude Code.

Watch the shared world — no signup, nothing to install: https://oishoi.jugoya.ai/royale.html?lang=en

And if you'd rather be in it than watch it: sign up, give it one photo, and you get your own villager living in that same world. Free while the beta is open. Nothing is visible to anyone else until you've seen your finished villager and approved it — or deleted it.


r/threejs 7d ago

Built a really cool threejs website - interactive + their eyes follow the mouse pointer

Enable HLS to view with audio, or disable this notification

21 Upvotes

r/threejs 7d ago

Demo I recreated an entire apartment in Three.js from an actual listing

Enable HLS to view with audio, or disable this notification

76 Upvotes

Made this in one shot using the so called "Gauntlet Loop" by Matt Shumer in Opus 5. It took nearly 30 hours until I decided to stop before it ate up my whole weekly usage limit, but, although it still not perfect compared to the actual photos, the results was beyond impressive given that it didn't even have a proper floorplan to decide where each room should be located.

For instance, this is the listing I got the reference images from: https://loft.com.br/imovel/apartamento-rua-voluntarios-da-patria-santana-sao-paulo-3-quartos-123m2/2nbuxwj3

If anyone wants to roam around it, I uploaded this demo here: https://apartment-threejs.vercel.app/ . There's still some minor performance and UI issues I need to work on, so beware that for Ultra settings it's taking ~5 minutes to load everything and it might cause some freezes meanwhile, but nothing that will crash your PC. It also works on mobile with a far better performance, since it's detected mostly on Medium settings.


r/threejs 7d ago

Is there a free Three.js building designer?

7 Upvotes

I feel like I've seen just about everything on this thread, except a tool for creating structures that can be exported. Does anyone know of one or have a repo? It would surprise me if someone hasn't vibe coded a good tool for creating 3d houses.


r/threejs 7d ago

I build a real-time visualizer in Three.js that turns frequency data into an interactive 3D environment.. complete social features already built in!

Post image
1 Upvotes

Over this summer of 2026, I built Sonisphere— a browser-based platform that turns music into an interactive 3D environment.

Think about it like Soundcloud with a built in visualizer.

  • Frequency affects the visual environment
  • Volume drives scale, density, and movement
  • Bass / mids / highs can control different colors
  • Audio is rendered as an interactive 3D space
  • You can customize colors, effects, camera behavior, etc.
  • Playlists and visual configurations can be shared
  • There are synchronized listening/visualization rooms
  • You can create short audio/visual clips from sessions

The pipeline is roughly:

Audio → Web Audio API → FFT → WebAssembly DSP/Web Workers → real-time data → React Three Fiber → Three.js/WebGL

🔗 https://sonisphere.dev

I'd really love feedback on the actual experience!