A modern & lightweight HTML5 game engine

melonJS is an open-source HTML5 game engine for building 2D games with JavaScript and TypeScript. Lightweight, dependency-free, and under 100kb gzipped.

Fast

Modern ES6 architecture. WebGL renderer with Canvas fallback. Web Audio with 3D spatial sound.

Free

Released under the permissive MIT License. No cost. Forever.

Standalone

Zero dependencies. Compatible with all major browsers and mobile devices. Under 100kb gzipped.

Why melonJS?

melonJS is designed so you can focus on making games, not on graphics plumbing.

Canvas2D-Inspired API

If you've used the HTML5 Canvas, you already know melonJS. The rendering API (save, restore, translate, rotate, setColor, fillRect, ...) follows the same familiar patterns — no render graphs, no shader pipelines, no instruction sets to learn.

True Renderer Abstraction

Write your game once, run it on WebGL or Canvas2D with zero code changes. The engine handles all GPU complexity behind a unified API, with automatic fallback when WebGL is not available. Designed to support future backends (WebGPU) without touching game code.

Complete Engine, Minimal Footprint

Physics, tilemaps, audio, input, cameras, tweens, particles, UI — a full 2D game stack in a single tree-shakeable ES module. No dependency sprawl, no library stitching.

Tiled as a First-Class Citizen

Deep Tiled integration built into the core: orthogonal, isometric, hexagonal and staggered maps, animated tilesets, collision shapes, object properties, compressed formats — all parsed and rendered natively.

Batteries Included

Get started in minutes with minimal setup. Sprites, animations, 3D mesh rendering, built-in & custom shaders, spatial audio and particle effects — ready to use out of the box.

Hackable by Design

ES6 classes throughout, a plugin system for engine extensions, and a clean architecture that's easy to extend without fighting the framework. Go as deep as you need.

Powerful Level Design

Design your levels visually with the Tiled map editor. melonJS natively supports orthogonal, isometric, and hexagonal maps with multiple layers, parallax scrolling, and more.

melonJS level design with Tiled map editor showing platformer game

Try it Live

Jump right into a melonJS game — playable in your browser.

Get Started in Seconds

Scaffold a new project with a single command:

npm create melonjs@latest my-game
cd my-game
npm install
npm run dev

Or use the API directly for a quick Hello World:

import { Application, Text } from "melonjs";

// create a new melonJS application
const app = new Application(1218, 562, {
    parent: "screen",
    scale: "auto",
});

// add a text display object
app.world.addChild(new Text(609, 281, {
    font: "Arial",
    size: 160,
    fillStyle: "#FFFFFF",
    textBaseline: "middle",
    textAlign: "center",
    text: "Hello World !",
}));

Features

Fast WebGL & Canvas rendering across desktop and mobile
Web Audio with 3D spatial sound
Sprites, animations, tinting, masking & 2D lighting
Built-in 2D physics & collision detection
Full Tiled map editor integration — every feature supported (any map format, animated tilesets, custom properties, parallax layers)
Multi-input: mouse, touch, keyboard, gamepad & accelerometer
Camera system with effects (shake, fade, flash)
UI toolkit with drag-and-drop support
Tweens, transitions & particle effects
3D mesh rendering with OBJ/MTL model loading & depth testing
Built-in & custom shader effects for per-sprite WebGL rendering
State manager, asset loader & plugin system
Under 100kb gzipped — zero dependencies