Paint 2D tilemaps in your browser and export JSON for any game engine
Click or drag to paint • Right-click to erase • Shift+click for flood fill
Tile Palette
About Tilemap Editor
Tilemap Editor is a free browser-based game development tool that helps indie developers and hobbyists paint 2d tilemaps in your browser and export json for any game engine. Game development involves many specialized tasks, and having the right tools accessible in your browser saves time and keeps your workflow smooth. No installation or engine-specific plugins required.
How to Use
1
Set grid dimensionsEnter your desired columns, rows, and tile size then click Apply to create the grid.
2
Select a tile and paintClick a color swatch in the palette to select it, then click or drag on the canvas to paint. Right-click erases tiles.
3
Export your mapClick "Export JSON" to download your tilemap data, including tile indices, colors, and names for use in your game engine.
FAQ
A tilemap is a 2D grid where each cell references a tile type — like grass, water, or stone. Game engines use tilemaps to efficiently render large game worlds by reusing a small set of tile images repeated across the grid.
Load the JSON file in your game engine. The data includes the full 2D tile array, column and row counts, tile size, and color/name lookup tables. Engines like Phaser, Godot, and Unity can all consume custom JSON tilemap formats with a small adapter script.
Undo is not yet supported in this version. Use "Clear All" to reset the entire grid, or re-paint individual tiles. We recommend exporting frequently to save your progress.
Match your game engine's tile size. Most retro-style games use 16×16px tiles, while modern games often use 32×32px or larger. The tile size you set here will be included in the JSON export so your engine knows the intended dimensions.