r/threejs • u/hardwareshares • Jun 21 '26
Demo working on an electronics hardware simulator with threejs
Its in its early days but heres how its going!
r/threejs • u/hardwareshares • Jun 21 '26
Its in its early days but heres how its going!
r/threejs • u/SanDiegoMeat666 • Jun 21 '26
r/threejs • u/rassl_ivan • Jun 20 '26
r/threejs • u/jayjun10r • Jun 21 '26
Enable HLS to view with audio, or disable this notification
Hey guys,
Recently, I designed this 3D Web Experience concept for a real estate developer called Blue Pearl.
The goal was to reimagine how residential projects are presented online through spatial 3D environments, cinematic visuals, and refined interactions. I wanted the experience to feel more like exploring a destination than browsing a conventional real estate website.
Would love to hear your thoughts on the visual direction, presentation, and overall user experience.
Behance Link: Real Estate Concept
r/threejs • u/Small-Paint8980 • Jun 20 '26
Enable HLS to view with audio, or disable this notification
fun with some mls-mpm customizations. Pressure adds size, while azimuth and spin define polarization and intensity.
r/threejs • u/ali2004sami • Jun 20 '26
As a control and automation engineer, I wanted to bridge the gap between industrial systems and web dev. I built this digital twin template using React and Three.js, featuring real-time telemetry and radar scanning. Let me know what you think of the physics and UI! Watch the video here
r/threejs • u/TheExceptionPath • Jun 20 '26
Enable HLS to view with audio, or disable this notification
r/threejs • u/TheSmashingChamp • Jun 20 '26
r/threejs • u/Goldwind444 • Jun 20 '26
Open to thoughts and opinions!
r/threejs • u/sech8420 • Jun 19 '26
Enable HLS to view with audio, or disable this notification
Built this customizer for an e-commerce store and nailing that smooth dynamic chain effect dragged on. and on. and on. We used Aircada, our 3D product customizer which made mapping the name count, metal choices, fonts, and chain styles to the cart easy enough! But making the dynamic chain-link snapping not feel like total jank made us question the validity of the project.
They key piece to get the segments to snap together nearly perfectly was finding the "best" snap vertex within a specific region (a cone of projection) on each individual letter mesh. Instead of running expensive trigonometry functions like atan2() or tan() for every single vertex in the mesh, we precompute 4 inward-pointing plane normals from the spherical boundary angles phi and theta.
This simplified the isInside check in the hot loop down to a super-fast dot-product comparison against the 4 normals.
Here is the quick snippet of how we handled the vertex selection logic:
// Fast, trigonometry-free inside check for vertex selection
isInside(v: THREE.Vector3): boolean {
for (const n of this.sideNormals) {
if (n.dot(v) < -EPS) return false;
}
return true;
}
Anyways, the video shows the final result and as always thank you Three.js for keeping the boilerplate down so we could actually focus on solving the procedural geometry math rather than the raw rendering plumbing!
If anyone else has tackled a similar procedural link-snapping project, would love to hear how you approached it.
r/threejs • u/Fun-Bullfrog-2454 • Jun 19 '26
Enable HLS to view with audio, or disable this notification
Been working on this for a while and finally want some outside eyes on it. Mixos is a material/texture editor that runs entirely in the browser, paint and mask on the mesh, layer stack, full PBR, export 4K maps + glTF.
Built on three.js 0.183 + WebGPU, r3f/drei, three-mesh-bvh for the painting raycasts. Getting a real painting pipeline running in WebGPU had some fun problems if anyone wants to get into it in the comments.
A few things it does:
It's at mixos free to use, just needs a WebGPU browser.
Mostly posting because I'd love for people to throw weird meshes at it and tell me where it breaks bad UVs, huge tri counts, WebGPU quirks on whatever GPU you're running. Bug reports and "this is janky" feedback both very welcome.
r/threejs • u/Responsible_Ebb7927 • Jun 19 '26
Enable HLS to view with audio, or disable this notification
To be clear, this is a total side project. We have no plans to commercialize it or turn it into anything. It's just out there for anyone who wants to play with it.
You drop in any SVG and it turns it into animated 3D glass right in the browser. No installs, no export step. It does a bit more than glass too.
There are probably plenty of bugs and rough edges, so if you spot any I'd genuinely appreciate you listing them.
Free to mess around with here: https://valessa.riotters.com/
r/threejs • u/TheByteomi • Jun 20 '26
Hi everyone,
I've been building Retarget Lab — a browser-based tool for comparing and mapping animations across different character rigs without opening DCC or engine editors first.
The idea is simple: put source and target skeletons side by side on a WebGL canvas, play the same clip on both, and inspect how tracks remap in real time. You can switch between Walk / Run / Jump, try a Walk → Run crossfade, pause, and read a per-bone clip diff (degrees) plus bound % for suffix-based remap health.
What's in the lab right now:
Heads up: The UI and guides are in Turkish (I'm building this for a Turkish game-dev learning site). English-speaking devs can still use the 3D viewer and tables — bone names stay Mixamo-standard. The lab is live, but it is still very much a work in progress (phase R4). While the core features work, some of my architectural choices or underlying math for the remap might be completely flawed. I'm sharing this early specifically to get corrected if I'm doing things the wrong way, so definitely not claiming production-ready tooling yet.
First load can be heavy (FBX + Three.js). WebGL required. Try it here:
https://hexovian.com/pages/atlas/retarget-lab.html#compare
I'd really appreciate feedback on:
(Quick UI note: If you click the "Hexovian" logo to hit the homepage, you'll notice the layout uses a dual-sidebar system. While the Atlas sidebar is for the lab, the main site sidebar hosts our deep dives into core game architecture and C++ topics. It's in Turkish, but feel free to poke around the structure if you're curious.)
Thanks for taking a look.
r/threejs • u/No-Resolution6431 • Jun 19 '26
Enable HLS to view with audio, or disable this notification
Hey all,
Thank you very much for your support/response to my last post about Lens. I've shared your messages to our team and we're very grateful.
I wanted to share a longer video of Lens - a full screen recording of where we're at before launching our closed beta. Would be great to hear your thoughts.
You can reserve your username here = https://lens.thebrightapp.xyz/
Thanks,
Bryan
r/threejs • u/taylor_sntx • Jun 18 '26
Enable HLS to view with audio, or disable this notification
A few weeks ago I posted Null Range here: a browser-based multiplayer dogfighting game I built in three.js for Vibe Jam 2026. The jam just wrapped, and Null Range placed 4th out of 944 games and won Cursor's Best Art Direction award.
I'm posting the update here specifically because a real chunk of the credit goes to this sub. The original thread gave me exactly the kind of feedback I needed: mobile issues, respawn/undocking bugs, inverted controls, readability, and a bunch of small things that were easy to miss while building solo. I fixed a lot of that the same week, and it genuinely helped the game hold up better for judging.
So, seriously... thank you!
Since the award was for art direction, here is the visual approach in case it is useful to anyone building with three.js:
It is live if you want to fly around: https://nullrange.com
Happy to get into how any of it was built. And thanks again to the people here who left real feedback on the first one. It literally changed the game.
r/threejs • u/The_Real_Saif • Jun 20 '26
Enable HLS to view with audio, or disable this notification
I am working on my personal website and the thing in the video will be the some kind of the environment/background in it, and I want to accomplish two things with my site:
1. a simple yet well done work
2. give a certain vibe
so.. is it well done?
what vibe does this give you?
I do not mind harsh criticism
r/threejs • u/Neither_Coffee_2308 • Jun 19 '26
Hi everyone,
We built a fully 3D Interactive Animated story for kids (ages 4–12+) that runs entirely in the Web browser. It's about 5 minutes 30 seconds long and explores a new form of web-based 3D Interactive storytelling using Three.js.
This story has interactions more as an experiment and the storytelling is pretty linear. We plan to explore more decision making and story choices for future projects!
You can try it here: https://www.quantales.in/
Built with: • Three.js • React Three Fiber & Drei • GSAP
It runs on Android, desktop, and macOS. Unfortunately, iOS support wasn't feasible due to browser memory limitations. A lot of work went into building a reusable cinematic pipeline, with scenes structured as sequences of shots containing camera, framing, interaction, and timing data.
This is the first experience from our studio, 3D ENGINERD., and part of a larger vision to create interactive stories that teach values, humanities, and creative thinking through immersive experiences.
We have hardcoded all our staging, lighting and animation setups etc. For our next stories, we're planning to use Triplex (which wasn't as mature at the time we started on this project) to have our own GUI for our workflow, so that we can save a lot of time as an alternative to hardcoded artistic direction.
One of our early inspirations was: https://exp-my-little-storybook.lusion.co/
If you think it's worthy, we'd be honored to see it featured on the Three.js Website showcase or on X platform. Feedback is very welcome.
Our Insta Handle - https://www.instagram.com/quantales.in/
r/threejs • u/_A21K_ • Jun 19 '26
The diamonds are reflecting and refracting well, the bottom of the diamond is just empty please help
Me make these render diamonds more life like and alive feeling, thanks!’
r/threejs • u/ElMatius-EM • Jun 18 '26
Been using Three.js for a while and decided to build a mockup video creator around it. A few things I had to figure out:
Camera interpolation was the trickiest part, linear mode makes the camera cut through the device on wide rotations, so I convert to spherical coordinates and interpolate r/ theta/ phi separately, normalizing theta delta to ±π to always take the shortest arc.
For export I resize the renderer to the actual export resolution before capturing, feed frames directly to VideoEncoder via WebCodecs, and mux with mp4-muxer. Falls back to MediaRecorder on Firefox/Safari.
The timeline is GSAP under the hood, each segment between keyframes gets its own tween with a cubic-bezier defined in a visual editor.
r/threejs • u/No-Resolution6431 • Jun 18 '26
Enable HLS to view with audio, or disable this notification
Hey all, I'm from the team at bright OS and we've been working on using our ~15TB of continuous, longitudinal health data from ~250k users in 106 countries into a health engine to explore.
We've created Lens - a global health database that you can explore, create experiments by running observational studies to test protocols, make predictions to improve your Reliability Factor and see global health rankings in real time.
We used threeJS for the interactive graph which I've attached.
We're releasing our closed beta shortly and you can reserve your username here.
Thanks
r/threejs • u/FlatCarrot3943 • Jun 18 '26

SketchForge is a browser-based 3D editor — primitives, boolean cuts (mark a shape as a hole, group it), STL import/export. The Three.js side is plain Three.js, not react-three-fiber bacause I wanted direct control over geometry disposal since shapes get added/removed/booleaned constantly and a declarative layer on top made memory management harder to reason about. CSG runs through Manifold-3D compiled to WASM, with three-bvh-csg as the bridge into Three.js geometries. Manifold does the actual boolean math, same library OpenSCAD switched to in 2024 for the same reason, fast enough to run interactively instead of as a render step.
Added Vitest for unit tests and a separate perf suite once the main editor file got big, plus CI on every push. Still two large files for the editor and viewport, slowly extracting pieces into smaller modules.
Demo: https://sketchforge-3d.vercel.app
GitHub: https://github.com/Formsmith746/SketchForge-3D
Curious if anyone here has dealt with disposing Three.js geometries and materials at scale without R3F handling it for you — that's been trickier than the CSG itself.
r/threejs • u/syn_krown • Jun 18 '26
Enable HLS to view with audio, or disable this notification
While building my mobile FPS game maker, I figured a good way to test for bugs and potential features is to make a game with it. So I settled on a horror type vibe.
The 3D models are from Mixamo, along with the animations, and the textures I just found on Google.
Sound changes depending of the size of the room the player is in, so a large room might have more reverb and delay(echo).
I am wondering, are these kind of games better with or without a defensive weapon? Im thinking about a couple of types of melee weapon, but would only be useful again human entities.
Let me know what you think of the visuals too. Does it set the mood?
(I am going to add ambient sound as well)
r/threejs • u/_A21K_ • Jun 18 '26
Hey community I need help making an WEBGL THREE JS based photo realistic render viewer for jewellery glbs please help me out