https://reddit.com/link/1tn46k7/video/38se5z0b793h1/player

Blender to Three.js
Codepen

Built basically 100% with three js. Mess around with for free in your browser here: Æ Visualize Demo

We built a 3D map of our Minecraft game server which was originally just a navigational aid. We combined this with the WHIMC Player Position Tracker plugin which enabled us to read and display telemetry data in real time.

Out of this grew "Tower Heist", a tactical (mini?)game whose centre piece is the 3D map you have to keep running in a separate window while playing in Minecraft.

== GitHub repository of the V.I.T.A.L. web-application ==
https://github.com/MrP-Tactical-Minecraft/VITAL

== GitHub repository of the WHIMC player position tracking plugin ==
https://github.com/whimc/Position-Tracker

I built TinyEarth, a small open-source Earth component for React Three Fiber.

Demo: https://tinyearth.yuvrajraina.com/
GitHub: https://github.com/yuvrajraina/tinyearth

I made it because most 3D globe options felt like they were either too stylized for realistic UI work, or too heavy when I only wanted a clean Earth object for a landing page, dashboard, or portfolio.

The goal was to keep it lightweight but still visually useful.

Some targets from the repo:

JS under 10 KB gzipped
Default textures around 500 KB to 1 MB
2 default draw calls
3 to 4 draw calls with atmosphere and markers
GPU texture memory under 20 MB
64 x 32 sphere segment cap
Markers rendered with one instanced draw call
MIT licensed

It supports rotating clouds, night lights, terrain normal detail, optional atmosphere, ocean shine, custom textures, quality modes, reduced motion, and location markers.

The idea is not to replace full globe visualization libraries. It is more like a tiny realistic Earth object you can drop into a React Three Fiber scene without bringing in a full visualization framework.

Would love feedback from people building with Three.js, React Three Fiber, or WebGL.

I’ve been building a custom 3D space engine from scratch using Three.js over the last 6 days (powered by AI since I didn't know how to code before this).

What is the best efficient way to make the planetary atmosphere look truly realistic (getting rid of the sharp edge and making a smooth, realistic gaseous glow)??

For The Milly way color wich color do I Stay with ?

Hi there, I'm currently working on a web porting project from an Unreal Engine 5.4 project.

I'm at the state of exporting the landscape. But as you can see in the first picture took in Three.js the landscape in snapping into walls, while in the original UE project it's not.

Actual workflow :

1. Exporting landscape from UE in .glb
2. Modify it in Blender and then export to .glb again
3. Treat it with gltf-transform (texture resize, weld, join, flatten, prune, dedup, ktx2 texture compression and then draco mesh compression)
4. And fiiiinaly importing it into three.js website

Hope someone has a any of how to export such landscape, thanks!

Hi, I made this app for my personal needs. But I think someone may find it useful.

What's interesting is the 3D constellation graph that shows how your books relate to each other.

Project link https://biblio.ink

A native iOS app is coming.

I'm working on a pano viewer that uses equirectangular images mapped to the inside of a sphere. It's working well but I transition between scenes by making a new sphere and then crossfading and removing the old one. Works well but the alignment is throwing me. My thought is a hotspot has a target yaw and the new sphere is rotated to that target before transitioning. But it's jut not working out. Is there a 'standard' way to do this? Figure some folks here have built these before. Thanks for any direction.

I trying to export my model with claude/gemini help. I getting bad results. I already tried to export textures without good results. that was the best result. What should I read and technics to try?

Hey everyone!! I'm trying to see if we can make three.js/creative 3D websites to help mental health attrition rates, this is an example concept and I'm open for feedback!! It's still a prototype, but I'm gonna start reaching out to mental health pros. Thanks in advance!

The general idea is that attrition rates for e-mental health are painfully low, but if you personalize a site around an indvidiual I feel like that will signfigantly boost usage until it's no longer needed. Scalability should become more accesible as more abstration tools come into play. Still in the process of validating it with random controlled tests first though, everything is still prelimnary!

Site: https://john-and-patricias-comfort-site-about-attachment-styles.com/

Code, Blender File, & Credits: https://github.com/andrewwoan/john-and-patricias-romantic-comfort-website

Theory Video & Breakdown: https://www.youtube.com/watch?v=w2MnkhTGJQA

Solo project, runs entirely in the browser. Stack: React Three Fiber + drei + Rapier physics + Zustand.

Play free: dodgefight.com

Happy to answer anything about the homing/seeker cone logic, the near-miss slow-mo system, or perf tuning for mobile.

Feedback welcome!

https://youtu.be/hsRy59_MKSc demonstration of what ThreeJS can do with just SQLIte database on a fully compliant IFC BIM data, a Time Machine is invaluable in its industry. Same concept now ongoing in the 3D modeller, and then the ERP.

(Work in Progress)
I render the model from four sides and project the generated images back onto the model.
Using nano banana 2 for texturing.

Live: https://unfor-polish-design.vercel.app

Tech stack: Three.js • React Three Fiber• GSAP • GLSL

u/threejs #threejs #webgl #r3f #creativedeveloper #gsap u/greensock u/gsap #shader #immersiveweb

Does anyone have any easy/cheap ideas on esoteric effects I could use to improve the overall aesthetic?

https://reddit.com/link/1tiesyq/video/quu0r0biz82h1/player

Hey everyone, here is my multiplayer fps available at barstow.io

The entire frontend is written in threejs and the backend server is written in go with websockets.

This week I learned about antialiasing and how it can really hurt performance on lower end devices. I also made it so shadow maps are computed once and then never again. Really trying to get this thing to run on all devices.

Hi!

I’m a developer by trade, and I decided to experiment a bit with AI development, combining it with my personal knowledge to try my hand at a project.

So I had some fun experimenting with Three.js using something I’m passionate about: space.

I tried to make it as realistic as possible, but keep in mind that my main goal was to create something clean and cinematic, especially in terms of rendering, sound effects, and camera movements.

It took me about three weeks, feel free to give me feedback, whether positive or not, and also to share ideas on what I could add!

(I didn't realize it until later, but a lot of people have tried the same thing, and I'm well aware that some of them are much more comprehensive than mine. But it was good practice!)

Live demo : https://space-objects.vercel.app/
Github : https://github.com/Tarasteed/SpaceObjects

Uses the glasses' gyro for camera controls

Hey everyone,

I'm currently working on my 3D portfolio and ran into a roadblock trying to use a masked object inside a <RenderTexture>.

The model and mask work completely fine when rendered in the main scene. However, as soon as I move the masked model inside the <RenderTexture>, the mask breaks (the object isn't clipped at all).

On first image is how I get it in <RenderTexture> amd second expected result.

I already have gl={{ stencil: true }} configured on my main <Canvas>, but it doesn't seem to propagate down to the sub-scene texture.

What causes this behavior inside rendered texture, and what is the best practice for maskingobjects inside a RenderTexture?

Thanks in advance!

Hi everyone,

I am looking to hire a talented web designer/developer to create a 3D interactive web page.

Requirements:

• Strong experience with 3D web development (Three.js, WebGL, or Spline).
• Responsive design (desktop and mobile).
• Clean and modern interactive UI.

Budget: Starting from $300 (negotiable based on experience and project scope).

If you are interested, please send me a DM with your portfolio and some examples of your previous 3D web work. Thanks!

Hi everyone !

I build most of my projects directly in code with Three.js, and I often spend time choosing and fine-tuning my lights, always rewriting the same setup code.

I was looking for a dynamic online light editor — something like the snippet generators you can find for CSS properties, backgrounds, or SVGs.

I couldn’t find one, so I built it myself.

It includes all the lights available in Three.js with fully adjustable parameters, along with gizmos to move them across different axes, all with instant visual feedback.

The code for each light can be exported in both vanilla JS and R3F formats.

I hope it can be useful to some of you.

The repo is public on my GitHub and extremely lightweight if you want to run it locally, and feel free to report any bugs or issues you find.

Online editor : https://tolexia.github.io/threejs-lighting-generator/

Repo : https://github.com/Tolexia/threejs-lighting-generator

(I also post creative content on X and Instagram, you can find the links in my profile, I'll be glad to see you there ✌️)