Skip to content
Get packs

Matter.js

A JavaScript library for simulating 2D solid objects that collide, bounce and stack in the browser.

GitHub Download source
Stars
18.6k
Forks
2k
Licence
MIT
Language
JavaScript
Last update
1 months ago
Type
Library

What it is

Matter.js is a JavaScript library that simulates how flat (2D) solid objects move, collide, bounce and rest on each other, such as boxes falling onto a pile or balls rolling down a ramp. Developers add it to a web page to make interactive scenes, games or animations feel physical. It runs in browsers and in Node.js, and the README describes it as an original implementation rather than a port of another engine.

  • Create a stack of boxes that collides and comes to rest realistically
  • Build a slingshot or catapult game using constraints and collision events
  • Add raycasting or region queries to detect what is under the cursor
  • Run a physics simulation in Node.js without a browser

Great for

  • Web developers adding physics-based motion to a canvas or web page
  • Hobbyists building small 2D browser games or interactive demos
  • Students learning how rigid body physics works in code
  • Developers who need a lightweight 2D engine with no native dependencies

Not ideal for

  • People needing 3D physics, since the README describes only a 2D engine
  • Projects requiring highly realistic soft materials or fluids, as the feature list centers on rigid bodies
  • Non-programmers looking for a ready-made app, since it is a library to write code with
Step-by-step guide: how to use Matter.jsInstall, first run, examples, tips and FAQs
Jolt Physics vs Matter.js

How to get it

  1. 1

    Install with a package manager

    You'll need: Node.js (for npm install) or a web page that can load a script file

    Install via npm

    npm install matter-js
  2. 2

    Run it

    • Install the package with npm install matter-js or include the matter.js script in a web page
    • Open the Getting started wiki page for a minimal usage example
    • Create an engine, add bodies to the world, and run the update loop
    • Open one of the linked demos to see the engine in action
  3. 3

    Get the most out of it

    • Browse the examples directory, which contains the source for all demos
    • Use the Plugins section and the list of plugins to extend the engine
    • Use MatterTools, linked in the README, to create, test and debug worlds
    • Use World state serialisation with resurrect.js if you need to save and restore a scene

Downloads

Source code (.zip)master branch · straight from GitHub

Strengths

  • MIT licensed and free to use in commercial and personal projects
  • Broad feature set including constraints, collision events, sleeping bodies and time scaling
  • Large set of published demos and examples to learn from

Trade-offs

  • Limited to 2D physics according to the README
  • The README notes bundler configs such as Webpack and Vue watchers can slow performance in development
  • The README lists no formal release version, so you rely on the master branch or tags

How it compares

ProjectStarsTypeLevelUpdatedBest for
matter-js (this)18.6kLibraryintermediate1 months agoWeb developers adding physics-based motion to a canvas or web page
JoltPhysics12.1kLibraryadvanced4 days agoC++ game developers who need a physics engine for rigid bodies and collisions
three.js117kLibraryintermediate4 days agoWeb developers adding interactive 3D graphics to a website
pixijs48.6kLibraryintermediate6 days agoWeb developers building interactive 2D graphics or animations
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.