The isometric grid
Diamonds of the size you pick, in the Board section. Lines snap to 2:1 with Shift, and shapes lie on the ground or stand on a wall.
Isometric pixel art
Isometric pixel art
Baipix has a 2:1 isometric grid, lines that snap to it, and volumes that come out shaded in one drag: boxes, cylinders, pyramids, stairs. You block out the scene in minutes, then finish it pixel by pixel.
Spring · isometric grid
Autumn
Winter
Night
The tools
Volumes in one drag.
Box and pyramid
Drag across the top, set the height. The sides come out darker from the palette, with an outline, a light edge and bevels if you want.
Cylinder, stairs, ramps
A cylinder upright or lying down, a slope or a staircase of even steps, rising toward the corner you pick.
Faces and tiles
Pick the top, left and right colors by hand, and choose which edges of a floor tile get the outline.
How to start
From blocks to details.
- 1
Start a scene
New file › Isometric scene, or turn on the isometric grid in the Board section of any drawing.
- 2
Block it out
Lay the ground, then the walls, roofs and props with the volume tools, one object per layer. Layer › Sort by depth puts the closest in front.
- 3
Finish by hand
Windows, plants, wear and light with the pencil. Shade and Lighten step along the palette's ramps, so the faces keep their colors.
Tips
Clean isometric pixel art.
Keep to 2:1
Two pixels across for one up, everywhere. Other slopes make uneven steps that read as jagged.
One light
Light from one side for the whole scene: the top lightest, one side in between, the other darkest.
Outline the outside
A dark outline around each object, lighter lines or none between its faces, so shapes stay readable.
Few colors
A small palette with a ramp per material keeps the scene together. Change the season by changing the palette.
Every tool is on the Draw page. To bring the scene into a design, see Pixel art to SVG.
Questions
Common questions.
What is isometric pixel art?
Pixel art drawn at an angle that shows the top and two sides of things at once, as in many strategy and simulation games. Its lines go two pixels across for one up, which keeps them clean.
What angle is isometric pixel art?
Lines go 2 pixels across for 1 pixel up or down, about 26.6°, instead of the 30° of true isometric. At that slope every step is the same, so edges stay even.
Can I make isometric tiles for a game?
Yes. The tile preview repeats an isometric tile staggered, the way they fit together, and Export › Tileset cuts a drawing into tiles for Godot or Tiled.
Do I have to draw every face by hand?
No. Boxes, cylinders, pyramids, stairs and ramps come out shaded from one color in one drag, with an outline if you want. You add the details on top.
Is it free?
Yes. Baipix is free and open source (MIT). It runs in your browser, with no account, and your drawings stay on your device.
Draw your first pixel.
Free and open source, under the MIT license. No account, and your drawings stay on your device.