Three.js

3D engine for the web

FreeAnimation & motionthreejs.org

What it is

The de-facto web 3D engine: scene graph over WebGL and now WebGPU, with cameras, lights, PBR materials and glTF/DRACO/KTX2 loaders. Current release r185. Measured at ~182 kB gz full, ~110–150 kB gz tree-shaken.

Why it earns a slot

Only if your project genuinely needs a 3D object — a rotating camera body, an interactive gear explainer. On a photo-led publication, 150 kB+ of engine competes directly with your actual images for LCP.

Know before you commit

Still pre-1.0 (0.185.x) and minor bumps carry breaking changes — pin the version. Do not use it for decorative 2D motion; a CSS gradient gets 90% of the effect for 0 kB.

Getting started

npm install three @types/three

Field notes

0 from the community

Loading notes…

Field check

Unverified

Pricing snapshot

Free · MIT

Snapshots move fast — verify at checkout, and post a field note if it changed.

Drop into your Lovable chat

Evaluate Three.js (https://threejs.org/docs/) for this project, then use it only if it fits what we are already building.
Context: 3D engine for the web. The de-facto web 3D engine: scene graph over WebGL and now WebGPU, with cameras, lights, PBR materials and glTF/DRACO/KTX2 loaders. Current release r185. Measured at ~182 kB gz full, ~110–150 kB gz tree-shaken.
Reviewer notes (general, not written for this codebase): Only if your project genuinely needs a 3D object — a rotating camera body, an interactive gear explainer. On a photo-led publication, 150 kB+ of engine competes directly with your actual images for LCP.
Watch out for: Still pre-1.0 (0.185.x) and minor bumps carry breaking changes — pin the version. Do not use it for decorative 2D motion; a CSS gradient gets 90% of the effect for 0 kB.
Pricing: Free · MIT
Setup: npm install three @types/three
Rules: treat the notes above as background only. Do not assume a theme, style, layout or feature that is not already in this project — inspect the existing code first and ask me before changing visual direction.

/api/public/tools/three-js

Neighbourhood

How Three.js sits against the rest of the atlas — swaps, companions and the tools builders actually save alongside it.