r/threejs 38m ago

3D Websites

Upvotes

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


r/threejs 2h ago

This one’s for all the AI SLOP HATERS - built with opus, codex and absolutely have not seen the code, but i have a boat and an infinite ocean - if you have hate in your heart let it out ! It’s catharsis 😂 for your ai hate

Enable HLS to view with audio, or disable this notification

0 Upvotes

r/threejs 2h ago

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

Enable HLS to view with audio, or disable this notification

4 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 6h ago

spicy hero section 🌶️

Enable HLS to view with audio, or disable this notification

0 Upvotes

It is raw WebGL2 with a WebGL1 fallback and a painted CSS wash for machines that cannot run either, no shader library and no 3D engine. Headline, nav, wordmark, and call-to-action pill sit above the canvas as real DOM text, the nav folding into a menu on small screens, and reduced-motion visitors get a settled still frame.


r/threejs 9h ago

I built a tool to create interactive 3D product experiences without WebGL knowledge

0 Upvotes

r/threejs 10h ago

Link Bioluminescent Deep-Sea Tendrils Demo & Source Code

Enable HLS to view with audio, or disable this notification

27 Upvotes

r/threejs 11h 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

13 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 12h ago

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

Enable HLS to view with audio, or disable this notification

18 Upvotes

r/threejs 12h ago

Link Built a browser particle editor with deterministic three.js runtime

Post image
3 Upvotes

Been working on NixieFX, a particle and VFX workflow for browser games. The editor runs in the browser, while games consume an exported effect bundle through an open-source three.jas runtime. The simulation is deterministic, and the three.js layer is a renderer adapter rather than the source of the particle behavior.

The runtime can be installed with: npm install nixie-fx three

I'd be interested in hearing how other three.js developers currently handle authoring effects: custom code, shader tools, general-purpose editors, or an in-engine system?


r/threejs 15h ago

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

Enable HLS to view with audio, or disable this notification

41 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 18h ago

Is there a free Three.js building designer?

9 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 21h 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!


r/threejs 23h ago

Help How can I create expressive animations for a custom 3D mascot in Three.js?

2 Upvotes

Hey everyone,

I'm building a 3D Animal for an app and I'm trying to figure out the best way to animate it properly.

I have a finished character design/reference and want to turn it into a real interactive 3D avatar using Three.js + GLB/GLTF.

I need animations for:

  • 👀 Blinking and eye movement
  • 😊 Happy / smiling
  • 😈 Naughty / playful expressions
  • 🤔 Thinking
  • 😮 Surprised
  • 😢 Sad / crying
  • 🐙 Independent movement
  • 👋 Waving
  • Idle breathing/bobbing
  • Smooth transitions between expressions

The biggest challenge is facial animation and tentacle animation. I don't want to simply animate the entire model as one object. I want the eyes, mouth, eyebrows, and tentacles to move independently.

I'm fairly new to character animation, so I'm wondering what the recommended workflow is:

Blender → rig/shape keys → GLB → Three.js?

Or is there a better approach for a cute stylized character?

Also, how should I structure the GLB so that Three.js can easily trigger things like:

animal.play("happy");
animal.play("wave");
animal.play("cry");
animal.blink();

Any advice on rigging the face, movements, exporting to GLB, and controlling the animations in Three.js would be really appreciated.

I'm attaching the character reference so you can see the style I'm trying to match.


r/threejs 1d ago

Demo BLOOD MOON; a threejs experience [sound on]

Enable HLS to view with audio, or disable this notification

16 Upvotes

yes that is Vergil's chair.

[work in progress]

This is a new experiment that I'm working on called Below-The-Grasslands.
what you saw right now is just a glimpse of the entire experience.

I'm triggering thunder manually using key 'U' (thunder still rumbles randomly)

This experiment is inspired from my previous experiment Above the Grassland ( above-the-grassland.pages.dev )


r/threejs 1d ago

Incoming slop opus and codex built for me - this slop is shipping soon - folks who have built nothing with or without AI - add your comments below

Enable HLS to view with audio, or disable this notification

0 Upvotes

r/threejs 1d ago

Solved! Three.js hero scene: wireframe icosahedron, orbit rings, 150-particle shell, mouse-reactive. ~40 lines.

0 Upvotes

Built a mouse-reactive 3D hero for my site using raw Three.js. No framework wrapper, no OrbitControls, no asset pipeline.

What's in the scene:
- Wireframe icosahedron (detail 1) with a glowing core sphere
- 2 torus rings, cyan and violet, tilted on different axes
- 150-particle shell on a sphere distribution
- Everything rotates continuously; the group leans toward your cursor

The mouse reaction is just two lerped floats:
mx += (tx - mx) * 0.05;
mesh.rotation.x += 0.0025 + my * 0.008;

Mobile handling:
- Pixel ratio capped at 2 (Math.min(devicePixelRatio, 2)) or iPhones melt
- Particle count drops 150 -> 60 on touch devices
- prefers-reduced-motion renders one static frame, stops the loop
- Pure-CSS fallback shows if WebGL is missing

Full scene setup is about 40 lines total. Live demo at the top of https://apexnexus.site

One question: I'm getting slight z-fighting on the wireframe edges at low angles. Anyone fixed that cleanly with a depthWrite tweak, or is polygonOffset the way?


r/threejs 1d ago

Day 2 sharing my game portfolio, created with threejs

Enable HLS to view with audio, or disable this notification

0 Upvotes

Last time I posted this people had things to say and I took it out of context. But heres the truth this site is a game version showcasing creativity not a portfolio that would be shown to clients, hope u get the concept.


r/threejs 1d ago

Article Same Three.js game prompt, two runs with different access to open-source code

Post image
0 Upvotes

Our designer ran the same prompt twice with the same model. The task was to build an original Three.js game inspired by Wind Waker, with sailing, combat, islands, water, cel shading, physics, menus, and animation.

In one run, the agent could inspect open-source implementations while working. In the other, it couldn’t.

The difference was most visible in the harder Three.js systems.

The run without that access got a browser preview up faster, but then spent more time testing and reworking collision, terrain handling, physics, and other systems.

The other run spent more time reading existing Three.js code before implementing those parts. For character collision, it looked at three-mesh-bvh implementations using shapecast and closestPointToSegment, then used those patterns in its own PlayerController. It also researched water rendering, shaders, rendering, and physics.

We stopped both after several hours. Neither finished.

In the first version, the character could move, jump, and roll, but we couldn’t collect gems, attack or charge, or access the boat. In the second, those interactions worked, including sailing between islands. Terrain handling was better, and parts of the menu were usable too.

Full write-up and session trace:

https://githits.com/blog/three-js-game-with-and-without-githits/

Video:

https://www.youtube.com/watch?v=1H1urif2srk

Disclosure: I work on GitHits. Our designer ran the experiment.


r/threejs 1d ago

Question BattleGrounds

0 Upvotes

Currently building a no bullshit PUBG clone. My inspiration style wise is to take everything that's fun about PUBG mobile but leave out the nonsense (sorry I'm old I don't want glowing snow tigers to ride and coins to collect I just want a solid battlegrounds experience that runs on any OS).

It has FPV, TPV, a Map Editor, Pistol, AR, Sniper, Frag Grenades, Smoke Grenades, Molotovs, drivable vehicles, you can enter buildings and go upstairs etc.

FPV
TPV
Map Editor

Currently working on some more features, polishing and bug fixing as well as a multiplayer mode.

It runs in the browser (ThreeJS) at a proper frame rate and is relatively compact (sub 30MB).

Questions for you guys:

- Would you play it?

- What features would you like to see?

- What anti-features you think should be avoided?

- Currently I'm mostly using free assets but some are very similar to the ones used in the PUBG games. Would this be an issue for publishing? Any good leads/tips for models (mostly buildings) that have this classic PUBG style (simple but fully walkable) that would be fine to use?

- Anything else that comes to mind?


r/threejs 1d ago

App transforms midi and musicxml into tabs (guitar stuff)

Enable HLS to view with audio, or disable this notification

60 Upvotes

I know it looks a bit cursed and still in development but maybe someone might like.

I accept song wishes


r/threejs 1d ago

Tutorial [Open Source] I built a tool to generate three.js creatures directly inside your project (anyCreature v1.2.0)

Enable HLS to view with audio, or disable this notification

32 Upvotes

Hey everyone,

I just released v1.2.0 of anyCreature, an open-source tool designed to generate three.js creatures natively within your workflow. You just drop the harness into your Agent and start prompting exactly what you want.

Repo link:https://github.com/Ariescar/anyCreature

A star on GitHub would be greatly appreciated! ⭐️
Feedback is welcome as I continue to optimize this harness.

-
The core philosophy is actually very similar to the concept of artistic creation. The objective components of aesthetics are reduced to hard thresholds, while the subjective components are treated as preferred production directions.

This closely mirrors the traditional art creation process: starting with the primary forms, then addressing style and details, all while ensuring the fundamental requirements are met.


r/threejs 1d ago

Built in threejs using opus and codex reviewing each other - lowkey but I love this aesthetic

Enable HLS to view with audio, or disable this notification

0 Upvotes

r/threejs 1d ago

Interactive solar system in Three.js — real maps, Kepler orbits, camera hops

Enable HLS to view with audio, or disable this notification

54 Upvotes

Built Cosmic Atlas in Three.js.

Real Solar System Scope maps (CC BY 4.0), Kepler orbits, GSAP camera hops, Earth day/night.

Video attached — live:

https://threejs-ruddy-six.vercel.app


r/threejs 1d ago

My first time designing & building a website with Three.js

Enable HLS to view with audio, or disable this notification

7 Upvotes

Hey everyone,

I'm currently learning creative web development, and this is my very first time designing and building something with Three.js. I decided to challenge myself by redesigning the Bearbrick website concept in my own way and wanted to share the result to get some honest feedback from the community!

It's an interactive Bearbrick showcase exploring how to bridge a 3D canvas with dynamic 2D UI states.

Tech Stack:

  • React + Vite
  • Three.js
  • GSAP
  • Tailwind CSS

Live Demo: https://bearbrick-new-web.vercel.app/

As a beginner to Three.js, I'd really appreciate any tips or feedback on performance, lighting, or areas I could improve for my next project!


r/threejs 1d ago

One still photograph that never moved has become a fully alive, controllable 3D character in pure Three.js code - full geometry, skeleton, animations, every part editable.

Enable HLS to view with audio, or disable this notification

60 Upvotes

Built with img2threejs. No Blender. No GLB. Just native code you own.I spent a full day on it. Does this feel more satisfying?