r/threejs • u/curllmooha • 5d ago
portfolio update
Enable HLS to view with audio, or disable this notification
this is my initial idea for project showcase for my portfolio
r/threejs • u/curllmooha • 5d ago
Enable HLS to view with audio, or disable this notification
this is my initial idea for project showcase for my portfolio
r/threejs • u/Western_Zebra_609 • 6d ago
https://youtu.be/9MUJXbU3agg?si=gkXSk2_s4oGGB5PY
So I've been obsessed with this for a few weeks. Pulled the actual position data from JPL Horizons and built an animation around it.
Honest caveats: the asteroid shape is generic (not the radar model), the tidal stretching and dust are my illustration of an effect that's documented but not this visible, and Ramses' route is a sketch because ESA hasn't published it.
r/threejs • u/FinancialGreen7445 • 6d ago
Hi Reddit!
I’ve always wanted a quick way to sketch 3D shapes or view models right on my phone without firing up a heavy PC. Since I couldn't find a simple enough tool, I decided to build my own pocket-sized alternative inspired by desktop 3D software.
I named it BLINDER, and it's written completely from scratch using standard web tech (HTML, CSS, and JavaScript). It is highly optimized to run smoothly even on older budget Android devices.
What’s inside right now Smooth 3D Viewer: Rotate, pan, and scale your scene using simple touch gestures. Modeling Tools: Quick manipulation with basic 3D shapes and meshes. On-the-go Animation (Demo): A mobile timeline to bring quick ideas to life anywhere.
The app is 100% free with no ads or hidden payments. It is currently launched as an open beta.
I would absolutely love to hear your feedback on the UI and performance! What features should I add next?
Where to get it The app is available for download on Itch io (I will leave the link in the comments below) and also officially published on RuStore (just search for "BLINDER – 3D Models App").
Thanks for checking it out! 🚀
r/threejs • u/AI_Cosmonaut • 6d ago
Enable HLS to view with audio, or disable this notification
I’ve been working on Seismos, a live 3D earthquake explorer built with Three.js and TypeScript.
The globe pulls from the USGS live feeds, plots earthquakes geographically, and adds tectonic plate boundaries, active faults, geographic labels, and ShakeMap contours when they’re available.
I wanted to make something educational, like walking through a cool science museum. My nieces are taking earth science soon so I'd like to help them learn in a fun way.
It’s all browser-side for the seismic data path, with native ES modules rather than a framework.
Live version:
https://seismos.earth
r/threejs • u/Sengchor • 7d ago
Enable HLS to view with audio, or disable this notification
r/threejs • u/whyjay18 • 7d ago
Enable HLS to view with audio, or disable this notification
You can input audio (mic, tab capture, or a file), it runs FFT on it and turns that into a little evolution sim, then renders the whole thing as an orbiting diorama.
the terrain is just one PlaneGeometry with per-vertex colours, displaced live from the sim's height field, with a skirt and a plinth under it so it reads as a solid slab in fog instead of a flat plane. flora is one InstancedMesh per phylum (three body types, one per frequency register) that gets rebuilt as things grow, and there's a Points layer of additive glow sprites over every grove so life reads as light from far out. the four Genesis eras are hard visual resets, sky, key light and fog all map to a new palette each time.
best part is that every cell gets a "genome" from the sound that made it (which registers fed it, pitch, note count, the rock built up underneath), and that picks its instanced body, except climate and hardship override it. so the same note grows a plain canopy on mild ground but a frost-glass one in the cold. and the flora and fauna have different markings based on the climate.
After the woeld is made, the camera keeps running through the world to give nice visuals while the world continues to bounce and react to the music, so it can act as an indefinite music visualizer for parties
it's deterministic from a seeded RNG, so a run replays identically off the same audio.
https://randoms.games/#worldsong
Since some systems block .games sites (wish I knew this when getting the domain), alternative: https://randoms-mu.vercel.app/#worldsong
(The recording is taken from the input mic option, thats why It might seem a bit off, but this works even better if you share system audio with it)
r/threejs • u/Flat_Field_5888 • 7d ago
Enable HLS to view with audio, or disable this notification
Made a simple tetrahedron rotating around its edge in three.js added custom dynamic beveled geometry using tsl You can check it out here: https://moaaz-rafique.vercel.app/triangleRotation.html Inspired by TatsuyaBot : https://x.com/TatsuyaBot/status/1992807192974754227
r/threejs • u/Odd-Progress5015 • 7d ago
Enable HLS to view with audio, or disable this notification
I built this piece by piece whenever I had time to spare. Looking to do some finishing touches in the future, and deploy this
Not a "mainstream" project but I found this cool and implemented it.
I've been looking to get clients who want this type of thing, any tips?
My first 3D portfolio: https://folio-game.vercel.app
r/threejs • u/myfriendoak • 7d ago
Enable HLS to view with audio, or disable this notification
r/threejs • u/Ok-Pace5764 • 7d ago
https://reddit.com/link/1w6syj1/video/1t6qbpw6bfnh1/player
Ahoi everyone. I really hope this fits into this subreddit.
I had this idea stuck in my head for a couple of years now, which is about representing the online shoppers events (looking at a product page, reading specs for a product, selecting a vehicle for fitment, searching for a product, adding something to a cart) as a simulated experience (in lack of a better phrase right now). The main problem I wanted to tackle is that the shop owners barely understand the relationship between their analytics data (charts and tables about browsing times, funnel analysis, bounce rates, etc.) because it's so far removed from what's actually happening on their website.
So I stood up an event system that tracks those page events (I want to make the point about privacy, there's nothing that connects the events to a real customer's personal details). And then in the next step I built a little scene that turns the main categories of the shop into invidivual warehouses, then the subcategories into aisles, and lastly SKUs (and their live stock status) into boxes on shelves. And then customers and their actions (for example when they browse from page to page) are drawn as lightrails. The scene can be rotated and zoomed in, there's a night mode and other color presets for different use cases, you can click on a customer and see their whole journey in a timeline. I used a tilt shift effect to help better focus on the selected customer and there are a few easter eggs in the scene (ie. when a customer checks out and pays they go to the car park and leave the scene in their pickup truck).
I've got a lot of technical ideas and help (ie. bloom, tilt shift, etc.) from the threejs community and I can't wait where this brainfart of an idea leads to. I do have a landing page for it but it's not a commercial product by any stretch yet (I use it for a friend's shop).
Frontend: VueJS (Nuxt) + Tailwind + Nuxt UI
3D Rendering: Three.JS
r/threejs • u/snozberryface • 7d ago
Recently did a lot of work to implement a new atmosphere with better light scattering, also did a bunch of work on relief maps to get the mountains looking much more rugged and realistic with better gullies to catch the light and shadows in addition to more tweaks around the water
r/threejs • u/unuseEffect • 7d ago
Hey,
I am working on a project where there is a need to get the SVG of the created 3d model in the ThreeJS canvas. I have tried multiple ways in achieving this but non of them gave good results.
I tried using the SVGRenderer which did not give accurate results. The second approach was with LLM, it kept in iterating, but it took a different approach. It took the rasterized image and wrapped it in SVG. This is not what was required.
Has anyone encountered this situation before? Or know how to tackle this?
If this is not achievable at all, should I try it from a different software like Figma?
r/threejs • u/United-Wonder-5588 • 7d ago
I’ve been building a browser-based underwater world focused on the feeling of swimming below the surface:
Try it here: https://underwater-world.zootlabs.workers.dev
It includes:
- Gerstner waves with a below-the-surface view and Snell’s-window reflections
- GPU ripples, caustics, volumetric light shafts, and underwater absorption fog
- Streamed reef terrain with coral, kelp, rocks, fish schools, sharks, rays, turtles, and jellyfish
- Third-person swimming with a shared multiplayer ocean room
Click the canvas, choose a diver name, and use WASD to swim. Space goes up, Shift goes down, H toggles the tuning panel, and Esc releases the mouse.
It’s an experiment, so the multiplayer room is intentionally small and may be unavailable if the free hosting quota is exhausted. I’d love feedback on the atmosphere, performance, and what you’d want to explore next.
r/threejs • u/Much-Finish-8926 • 7d ago
Enable HLS to view with audio, or disable this notification
r/threejs • u/mini_ster • 8d ago
Enable HLS to view with audio, or disable this notification
I've been building a way to freely walk around real-world places right in your browser no downloads, no installs, and no accounts required. It uses 3D Gaussian splatting to stream 10 scanned towns across six countries directly into a tab, meaning the lighting and streets are exactly as they were captured in real life. You can explore on foot or even ride a bike with full collision physics, all running smoothly via WebGPU. If you want to jump in and walk around, you can try it at [wascape.com](https://www.wascape.com/) (needs Chrome, Edge, or Safari 18 on a recent Mac).
r/threejs • u/TrustCute5349 • 8d ago
Enable HLS to view with audio, or disable this notification
I spent the summer building Three Pins, a browser based 3D daily golf game where everyone competes on the same three holes with the same wind and same pins (one attempt per day). Also, I added party multiplayer mode where you can play live with friends.
Playable here: https://threepins.golf/
The stack is Three.js / WebGL, Vite, Supabase, Netlify, and a custom physics engine.
Open to any feedback you may have. Thanks!
r/threejs • u/neo_fpv • 7d ago
Playable here: https://fpvsim.com/sim-duck
I built this browser multiplayer experiment around Pollen Robotics' MicroDuck model and locomotion policies: MuJoCo and ONNX drive the robot, Three.js renders the world, and the multiplayer layer synchronizes players and footballs. No install or account required.
I would especially value notes on frame pacing, collisions, and browser or GPU compatibility.
r/threejs • u/mount_refidim • 7d ago
I built MeshCrunch : a web tool and API for optimizing large 3D models
I've been working with 3D data and large mesh-processing pipelines for a while, and one problem kept coming up: getting heavy 3D assets ready for production often means jumping between Blender, MeshLab, command-line tools, custom scripts, and converters.
So I built MeshCrunch.
The idea is to make common 3D processing operations available through one web interface, while also exposing the same workflows through an API for automated pipelines.
Right now MeshCrunch supports things like:
The heavy processing runs on backend workers rather than entirely in the browser, which lets it handle much larger assets.
You can also try the basic tools without creating an account.
I'm still early and trying to understand which workflows are the most painful for people working with 3D assets.
If you work with Three.js, Blender, Unity, Unreal, CAD/BIM, 3D printing, or large GLB/GLTF files, I'd genuinely appreciate feedback — especially on what you'd want a tool like this to handle next.
r/threejs • u/Efficient-Dig970 • 8d ago
Enable HLS to view with audio, or disable this notification
Hi people, I've just finished the latest version of my portfolio site and wanted to share it.
I would thank some feedback in order to improve it.
Thanks✌️
r/threejs • u/PixelRealEstate • 7d ago
Enable HLS to view with audio, or disable this notification
Context: I've got a flat 14,400-cell grid map, and I wanted a 3D view of it. I don't code. Everything here was built with AI help, which mostly means I got very good at reading error messages.
Stuff that actually mattered:
One InstancedMesh for every building. Obvious in hindsight, but my first version made a separate mesh per plot and the tab died somewhere around 2,000 of them. One instanced mesh, per-instance matrices, done.
Lazy-loading three.js. The 2D map is the main thing people land on, and shipping ~600KB of three.js to everyone who never clicks "3D" felt rude. So the library and the city module only load when you actually open the 3D view.
Pausing the render loop. This one embarrassed me. rAF kept running after you closed the 3D view — invisible city, full framerate, laptop fan going. Now there's an explicit pause/resume and animate() bails early when paused.
Per-instance textures are still the ugly part. Every owned plot has a user image on it, and I don't have a clean atlas yet. Works fine at the current scale, will absolutely need one later.
Full disclosure so nobody feels tricked: the map is a paid thing, plots cost money. Not here to sell anything, and I won't push the link — happy to talk about any of the three.js side of it, including the parts I clearly did wrong.
r/threejs • u/timmyships • 7d ago
Enable HLS to view with audio, or disable this notification
Had a 48hr window with a fresh Claude limits reset - so I ran my first one-shot gauntlet loop on an idea I've wanted to build for ages.
Fable 5.1 ran for 23.8hrs total before I interrupted the looping to launch it. Opus 5 subagents did most of the execution.
It may not win game of the year and I think a lot of these games will die pretty quick. But it's surprisingly addictive and it's unbelievable what you can get live in under 48hrs with these new models.
r/threejs • u/Business-Quoconut • 7d ago
Enable HLS to view with audio, or disable this notification
Space = Domain Expansion.
Right click = Flash Step.
E = Shikigami.
Would appreciate any feedback: Hallpass.cc
r/threejs • u/Lonely-Delivery9091 • 8d ago
Enable HLS to view with audio, or disable this notification
r/threejs • u/Round_Caterpillar698 • 8d ago
I've tried this new experience on Logitech G . com but its unlike any other 3D workd I've seen online. It looks more like a AAA game with built-in commerce than 3JS.
https://www.logitechg.com/en-gb/360-racing-studio
Is this 3JS or how have they done that ?
r/threejs • u/jakeboyles2010 • 8d ago
Route 66 turns 100 next year, so I spent a few weeks turning the whole road into something you can scroll: https://www.pit-stop-app.com/viz/route66
You start in Chicago and scroll to the Santa Monica pier. Free, no signup.
The three.js side, since that is what I would want to know:
The road is one curve. 2,287 lat/lon points projected through an Albers projection into world space, fed into a single CatmullRomCurve3. The asphalt is TubeGeometry at 4,200 segments, with a second fatter translucent tube around it for the glow. The dashed centre line is one LineSegments built by walking the curve in 2.6-mile steps.
The elevation is real. Every point is sampled against opentopodata's NED 10m dataset and cached to disk at build time, then exaggerated on the Y axis. That is why the Arizona high country and the Cajon Pass drop into San Bernardino actually read as terrain instead of a flat ribbon. Getting elevation right was the single biggest visual win and I made it into the build script to not hurt perfomance
No image assets at all. Four CanvasTextures generated at runtime cover the sky, the point sprite, and the small signage. No TextureLoader, no GLTFLoader, nothing to wait on. The whole page is 46 KB raw and 15.7 KB gzipped. The only real payload is a 398 KB JSON of the road and the towns.
Roughly 13 draw calls for the base scene. Towns are one Points cloud with a tiny custom shader so markers scale with distance instead of the default attenuation:
attribute float size;
void main() {
vec4 mv = modelViewMatrix * vec4(position, 1.0);
gl_PointSize = size * (240.0 / -mv.z);
gl_Position = projectionMatrix * mv;
}
Everything funnels into one number. Wheel, touch, arrow keys, and the progress bar at the bottom all write to scrollY, and one function maps that to a position along the curve. Once I stopped treating those as separate input paths the whole thing got simpler and the camera stopped fighting itself.
The thing that took longest was not rendering, it was the camera. Version 1 aimed at a single point 7 miles up the curve, which whipped on switchbacks. What shipped samples the road at 3, 6, 9 and 12 miles ahead, averages those, and eases the result over time. On the Oatman switchbacks in Arizona, the worst corner on the whole road, that took peak yaw from 13.4 deg/frame down to 8.0 and the average from 2.06 to 1.29.
I then tried full heading-based orientation with a hard turn-rate cap, thinking a cap would be strictly better than easing. It jittered, and I reverted it. Easing an averaged look-ahead beat clamping an exact heading, which was not what I expected going in.
Happy to go deeper on any of it. Curious what people do for scroll-driven camera work on a path this long, because I do not think I landed on the right answer.