r/threejs • • 21h ago

Demo Racing sim in Three.js: 500 Hz vehicle physics, GPU tyre deformation and physics simulations

0 Upvotes

Side project, 3 days in. Everything runs client-side: Next.js static export, Three.js for rendering, Web Audio for the engine sound.

Rendering: AgX tone mapping, a PMREM sky environment, a car-tracking sun shadow, bloom, clearcoat paint, and tyres that deform on the GPU (contact patch flattening, sidewall bulge) driven by the physics.
Physics: a separate fixed 500 Hz loop with 2 kHz substeps for the tyres and suspension.

Play: https://khazp.github.io/rwanda-f1-2026-sim/
Code (public repo): https://github.com/KhazP/rwanda-f1-2026-sim


r/threejs • • 6h ago

swapped two people in a music video for three.js cubes

1 Upvotes

wanted to see if i could do a "character replace" without any AI video tools. pose tracking finds the shoulders/elbows/wrists every frame, the people get painted out of the background, and two rounded-box cubes get rendered on top in three.js, following the arms and head tilt.

the orange one's mouth opens with the loudness of the vocals, the green one just vibes.

arms are still a bit noodly lol. any tips on making them less stiff?


r/threejs • • 4h ago

Some progress screenshots

Thumbnail
gallery
2 Upvotes

Building a super relaxing game where you pick berries and see the semi-procedural landscape grow and evolve.


r/threejs • • 9h ago

Assetto Corsa like game for drifting, has steering assist for keyboard / gamepad

4 Upvotes

play here: https://onroad-slop.vercel.app/

github: https://github.com/Arz-Gev/onroad

On the video I play with keyboard (it's hard), the car settings aren't fully there yet but you can try to setup it yourself in Tab menu or ask your agent to tweak it.

link with falg for flat map: https://onroad-slop.vercel.app/?map=flat


r/threejs • • 19h ago

Formula Cat: a Three.js racing game about cats on robot vacuums, packaged with Electron for Steam

8 Upvotes

Title: Formula Cat: a Three.js racing game about cats on robot vacuums, packaged with Electron for Steam

Formula Cat was built with JavaScript and Three.js, then packaged as a desktop game with Electron for Steam.

The original idea was pretty simple: a cat riding a robot vacuum. That was developed into a racing game with 22 cats, 11 teams, 31 circuits, and Story, Career, and Single Race modes. Actual racing was taken surprisingly seriously for a game where your car is a vacuum cleaner.

Three.js was used for rendering, with the simulation kept separate from rendering and input. Race state was stored in preallocated typed arrays using a data-oriented structure. With that separation, complete races could also be run without rendering, so opponent behavior and lap times could be tested.

The cat animations were tied to driving: forward lean was increased with speed, the tail was straightened behind the cat, and movement was added to the scarf and ears.

Physical pit lanes were added too. Your vacuum has to be stopped in its marked box before its battery is replaced by a robot arm. One box was shared between each pair of teammates, so a badly timed stop could be delayed behind your teammate.

For the Steam version, the web game was packaged with Electron and loaded inside its Chromium window. The Three.js renderer and JavaScript simulation were carried over into the desktop application.

Astra was used throughout development for implementation, debugging, tools, and tests. The direction and playtesting were handled by me. Plenty of adjustments were made after driving laps, including two banked corners that had been tilted the wrong way despite passing their automated test.

The Formula Cat Steam page is live! If racing cats on robot vacuums looks like your thing, a wishlist would be very much appreciated :)

More details about the Three.js side, simulation structure, or Electron packaging can be shared in the comments.


r/threejs • • 2h ago

How can I find creators to test a research project?

0 Upvotes

Hi friends! I am a CS grad student at Stanford conducting research on human-computer interaction for mobile three.js content. The premise is interactive content is exploding, and interaction mechanisms are the limiting factor to growth in the area.

Reddit & Twitter have been great to see the incredible projects people have built. Do you think these creators would be willing to work with a small research team? What expectations should I have? How can I best listen and learn from experienced devs? Thank you!


r/threejs • • 8h ago

I was left unsupervised with 15,191 images of my brain. Made a neat browser based, threejs visualiser, like nothing quite else I could find.

Thumbnail
brain.adamch.com
0 Upvotes

r/threejs • • 16h ago

Demo Using Three.js for scene data and asset loading around a custom WebGPU renderer

25 Upvotes

I've been working on a tropical island for RED SKIES AT DAWN, and Three.js still does a useful job in the engine even though rendering is handled separately.

I use Three.js for CPU scene objects, geometry, maths and asset loading. Junklab Engine owns the WebGPU renderer and shaders. That boundary lets me keep the scene and loading tools while developing the ocean, clouds, vegetation and coastal effects in the renderer.

The island combines procedural terrain and vegetation placement with authored routes, landmarks and imported assets. This is an offline Ultra capture from the development build on Mac.

Is anyone else using Three.js mainly as a CPU scene and asset layer around their own renderer?

AI use: AI-assisted coding and post copy, plus some AI-generated reef textures.

If you'd like to follow the game, you can wishlist RED SKIES AT DAWN on Steam:

https://store.steampowered.com/app/5268580/


r/threejs • • 18h ago

My Home: generated apartments you can explore as a little 3D diorama

19 Upvotes

My Home generates a floor plan, makes up the people who live there, and furnishes every room around them.

Free, no sign-up, nothing leaves your browser.

https://home.jannchie.com

Source: https://github.com/Jannchie/my-home


r/threejs • • 21h ago

I've been working on a medieval siege game called "Beyond the Rhine". Is this something you would play?

0 Upvotes

So... I've been developing a medieval strategy game named "Beyond the Rhine" and want to gauge interest from the community.

The game focuses on large-scale sieges against intricately designed, concentric walled cities. You can deploy vast armies consisting of cavalry, infantry, and cannons from the surrounding forests to attack these fortifications. The combat features dynamic destruction where cannon fire blows holes in the town walls, towers collapse in fiery explosions, and fires spread through the city buildings as your troops push through the breaches.

The tactical experience is supported by detailed campaign mechanics and customizable environments. You plan your army's movements on a regional map, such as preparing for the "Siege of Quedlinburg". During gameplay, you can use the settings menu to adjust environmental factors like the day/night cycle, rain, and fog to change the atmosphere of the battle. After securing a victory, the game provides a detailed breakdown of your casualties and plundered loot, followed by narrative events where you make decisions about the conquered town, such as seeking out mercenaries in the woods.

I'm trying to see if this mix of tactical deployment and explosive real-time destruction appeals to strategy fans. There is pixel mode graphics and normal 3d graphics, to mix things up...

THIS IS PRE-ALPHA, THE GAME MAY LOOK SUPER BAD IN SOME SCENES.


r/threejs • • 3h ago

Making an entire zombie town react to weather in Three.js

3 Upvotes

4 few weeks ago, I posted here about multiplayer flashlights causing a nearly 3-second freeze in my Three.js game.

This time, I’ve been working on making the town miserable in a different way: weather.

I put together this fixed-camera demo to show the same procedural town under changing weather and lighting conditions, running in real time in the browser.

The interesting challenge wasn’t just drawing rain. It was making the environment react to it — without making the inside of every building wet too.

A few implementation details:

  • Shared wetness control: a global uniform drives the wet appearance of roads, vegetation and characters. It controls the wetness response, not the entire weather system.
  • Keeping sheltered areas dry: a roof-height map determines which areas are exposed to rain, so the wetness doesn’t get applied everywhere indiscriminately.
  • Changing sunlight: the town falls into the surrounding ridge’s shadow as the sun goes down, with glare when looking toward the sun.

The fixed camera makes it much easier to see what each change contributes compared with a normal gameplay clip.

This is part of Zombies Tortilla, the browser-based multiplayer zombie game I’m building with Three.js.

For those working on procedural environments: how are you handling rain exposure? Are height maps enough for your scenes, or have you needed something more involved for shelters and overhangs?


r/threejs • • 6h ago

Using box3d to simulate real sailing physics - Tally Ho Sailing Game

55 Upvotes

I'd previously tried to use the classic physics libraries (ammo, cannon, rapier etc) to recreate sailing physics and found them to be unstable or inconsistent.

Box3d was released in June so I wanted to see if it would work any better - which it seems to!

Playable demo:
https://tally-ho-game.vercel.app/

To be clear this is not a fluid simulation (although I think that is possible!!), but its a step up from just force vectors on the overall boat which is what I have seen done in the past.

Details for those interested:

- Sails are coarse grids of point masses connected by spring joints. Lift and drag applied to each panel using apparent wind, this is again an approximation as in real life the wind is very affected as it flows over the sails, although with an older and slower style yacht like this (Gaff rig) it would be less noticeable than a modern rig.
- Spars and masts are... well just spars
- Ropes/ sheets are linked joints
- Anchor and chain is joints but with collision and mass
- Hull shape is a collection of spheres, with buoyancy and drag coefficients.

The physics is quite CPU intensive but putting in a webworker seems to work well as it not a fast paced game, it doesn't need to match 60 FPS.

If you are interested in the physics you can access the Lab in the top left menu. There is also a rig designer where you can modify the rig but its quite easy to make it... not functional 🤣

It uses real location data, cached for now but I have a steaming server, which means technically you could sail anywhere in the world. My plan is to also use real wind and weather data at the players location.

For the environment I found a nice way to blend COP30 (30m detail) elevation and GEBCO (460m detail) bathymetry data. Building envelopes are from OSM but proc generated with a different style. Vegetation and Ocean is from Dan Greenhecks amazing Tidewater demo although simplified to maintain performance.

And for those that recognise the boat, I also managed to use the Tally Ho lines plan to recreate the hull. Its not perfect but if people like it I can spent more time.

I was thinking to turn this into a idle style game where you sail the world if people enjoy it.


r/threejs • • 22h ago

Question Thanks for everything, Mr.doob.

Post image
12 Upvotes

r/threejs • • 5h ago

Link I'm Building an Endless Multiplayer Driving Game with Svelte (Self-Promo)

2 Upvotes

I've been working on Planet 0 Drive, a relaxing, low-poly 3D driving game built with Svelte, Three.js, and peer-to-peer multiplayer.

It's an endless driving experience where you can cruise around at your own pace, explore the world, discover interesting spots, chase new records, or compete and coordinate with friends.

On the technical side, the game features:

  • Three.js for 3D rendering, procedural world, and weather
  • Peer-to-peer multiplayer with optimized network updates and movement interpolation
  • Spatial audio and performance optimizations for smooth gameplay
  • Version-compatible rooms to keep multiplayer sessions in sync

Planet Zero Drive started with the idea of a relaxing drive through a landscape that keeps unfolding. It also gave me a place to experiment: how much world could I generate, how far could I render it, and what would it take to keep driving (fairly) smooth on a phone?

Play: https://planet0drive.vercel.app/

Blog https://zackwebster.com/blog/building-planet-zero-drive


r/threejs • • 14h ago

ThreeJS GLB File Quick Viewer for MacOS

2 Upvotes

hi guys, i made a GLB 3D File quick view viewer for macOS
Sourcode: https://github.com/wonglok/glb-viewer-quicklook/tree/main
release link: https://github.com/wonglok/glb-viewer-quicklook/releases/tag/v1.0


r/threejs • • 6h ago

Demo I made ruby and sapphire chess pieces with refraction, gold inlays and reflective boards in Three.js

5 Upvotes

I've been working on Morph Chess, a visual playground for chessboards and pieces in Three.js. I wanted to explore sculpted gemstone forms, deep colours and changing reflections as you move around the board.

The video follows the same order as the README:

0:00 — Ruby: all six pieces rotating in ruby and sapphire.

0:09 — Ruby × Dusk Mirror: pure gemstone pieces on smoky black crystal, with red light beneath the board.

0:18 — Night Oath: the same silhouettes with polished champagne-gold inlays.

0:27 — Night Oath × Midnight Silver: midnight-blue stone and celestial metalwork.

The gemstone shaders use view-dependent refraction, internal reflections and light absorption. These are recordings of the project's actual models and shaders.

Code, GIFs and local setup (MIT): https://github.com/AmethystineAlpaca/morph-chess

You can orbit, zoom and rearrange pieces. The current build focuses on board and piece design; chess rules and full gameplay are still to come.

Which combination do you prefer? I'd also love feedback on the gemstone and metal balance.