Skip to content

three.js

A JavaScript library for drawing and animating 3D scenes in web browsers.

Stars
117k
Forks
36.9k
Licence
MIT
Language
JavaScript
Last update
4 days ago
Type
Library

What it is

Three.js is a JavaScript library that lets developers create 3D scenes, cameras, and objects and display them in a web page. The README describes its aim as an easy-to-use, lightweight, cross-browser, general-purpose 3D library. It currently includes WebGL and WebGPU renderers, with SVG and CSS3D renderers available as addons.

  • Render a rotating 3D cube in a web page, as shown in the README usage example
  • Build an interactive 3D scene that responds to animation loops
  • Display 3D content through the WebGL or WebGPU renderers
  • Create SVG or CSS3D output using the addon renderers

Great for

  • Web developers adding interactive 3D graphics to a website
  • Developers building browser-based visualizations or simple 3D animations
  • People who already know JavaScript and want to start with 3D on the web

Not ideal for

  • People who only need 2D graphics, since the library is focused on 3D scenes
  • Anyone looking for a finished app rather than a code library to build with
  • Beginners with no JavaScript experience, as the README code assumes familiarity with modules and the browser
Step-by-step guide: how to use three.jsInstall, first run, examples, tips and FAQs

How to get it

  1. 1

    Install with a package manager

    You'll need: A modern web browser with WebGL support · Node.js or a bundler is likely needed to use the npm package, but the README does not specify

    Shallow clone of the repository

    git clone --depth=1 https://github.com/mrdoob/three.js.git
  2. 2

    Run it

    • Import the library with import * as THREE from 'three';
    • Create a camera, scene, and mesh using THREE.PerspectiveCamera, THREE.Scene, and THREE.Mesh
    • Create a WebGLRenderer, set its size, and append renderer.domElement to document.body
    • Use renderer.setAnimationLoop to update the mesh and render each frame
  3. 3

    Get the most out of it

    • Browse the official examples at threejs.org/examples to see working demos
    • Read the docs and manual at threejs.org for detailed API guidance
    • Check the migration guide on the project wiki when upgrading versions
    • Follow release notes on the GitHub releases page for changes

Downloads

Strengths

  • The README presents it as a general-purpose, cross-browser 3D library
  • Includes a documented usage example that creates a scene, camera, mesh, and renderer
  • Has extensive official resources listed, including examples, docs, and a manual

Trade-offs

  • The full git history is about 2 GB, so a shallow clone is recommended for most users
  • The README does not describe install steps beyond the import example, so setup details must come from the docs
  • Working in 3D requires understanding concepts like cameras, geometry, and materials

How it compares

ProjectStarsTypeLevelUpdatedBest for
three.js (this)117kLibraryintermediate4 days agoWeb developers adding interactive 3D graphics to a website
engine17.2kLibraryintermediate4 days agoWeb developers who want to add 3D scenes or games to a website
pixijs48.6kLibraryintermediate6 days agoWeb developers building interactive 2D graphics or animations
G212.7kLibraryintermediate8 days agoFront-end developers adding charts to a web dashboard
anime74.2kLibrarybeginner3 months agoFront-end developers adding motion to websites or web apps
Chart.js67.8kLibraryintermediate14 days agoWeb developers adding standard charts such as line or bar charts to a site

Stats synced from GitHub. The assessment above was drafted with AI from the project's README on 2026-10-29 and may miss recent changes — check the README before relying on a command. MIT licence: free to use, modify and distribute, including commercially, as long as you keep the copyright notice.