Isometric Grid GeneratorPrintable Graph Paper, SVG, PNG

Create an isometric grid of lines or dots, stack cubes on it, and print it as graph paper or save it as SVG or PNG.

Grid

Grid type
40 px
30°
°

Style and size

1
Background
Canvas size (px)
W
H

The Letter and A4 presets are sized at 150 pixels per inch.

Print / PDF fits the canvas to the page with 0.4 in margins. On US Letter, one cell side prints at about 0.34 in (8.6 mm). To save a PDF, choose "Save as PDF" as the destination in the print dialog.

A grid for isometric drawing, with a cube builder

An isometric grid is a pattern of diagonal lines, usually at 30 degrees, that helps you draw 3D shapes on a flat page. This tool builds one at the size and angle you choose, as lines or as dots, on a canvas from 100 to 4,000 pixels.

Switch to Stack cubes to build a shape by clicking squares on the floor and see it drawn with shaded faces. It is a quick way to plan an isometric drawing before you draw it.

When the grid is ready, print it on Letter or A4 paper, or save it as SVG or PNG. Everything runs in your browser.

What the grid is used for

Isometric graph paper and dot paper

Print a Letter or A4 sheet of lines or dots for sketching, technical drawing practice, or classroom exercises.

Illustrations and icons

Export the grid as SVG, put it on a locked layer in your design tool, and draw your isometric icons along it.

Game and pixel-art tiles

Switch to 26.57° for a 2:1 grid, the usual ratio for isometric tiles in pixel art.

Planning a block shape

Stack cubes to work out how a shape looks from the isometric view, then copy the SVG or draw it by hand.

How to make an isometric grid in 4 steps

  1. Choose Lines or Dots, then set the cell size and the angle. Use the 30° button for a standard grid.
  2. Set the line color and width, the background, and the canvas size. The Letter and A4 presets are made for printing.
  3. To draw a shape, switch to Stack cubes and click squares inside the dashed area.
  4. Click Copy SVG, Download SVG, or Download PNG, or choose your paper size and click Print / PDF.

Note: With Show vertical lines turned off, the lines grid becomes a diamond grid.

How the grid is built

  • Angle: the angle is the slope of the diagonal lines from the horizontal, from 10 to 60 degrees. The vertical lines always pass through the same points where the diagonals cross.
  • Cell size: the length of one cell side, in canvas pixels. On paper the size depends on how the canvas is scaled to the page. The page shows the approximate printed size.
  • Dots: dots are placed on the crossing points of the line grid. Above 60,000 dots the grid is not drawn, so make the cells larger or the canvas smaller.
  • Cubes: the cube floor is a square area in the middle of the canvas, up to 20 by 20 cells. It gets smaller when the cells are large. Cubes can be stacked 12 high, and undo keeps the last 50 steps.
  • Printing: the canvas is scaled to fit the page within 0.4 in margins, keeping its proportions. Letter and A4 are selectable.

Angles and what they are for

The angle is measured from the horizontal. The slope is the rise over the run of one diagonal line.

AngleSlopeCommon use
30°about 0.577Standard isometric: technical drawing, web illustrations, icons
26.57°0.5 (2:1)Isometric pixel art and game tiles
15°about 0.268A flatter grid for wide, low views
10° to 60°AnyCustom angles for other projections and patterns

Why 30 degrees. In an isometric view the three axes are 120 degrees apart, and the two receding axes slope at 30 degrees from the horizontal. That keeps all three directions equally foreshortened.

Why 26.57 degrees. A line that rises 1 pixel for every 2 pixels across makes an angle of about 26.57 degrees. Drawing pixel art on that slope keeps edges free of uneven steps.

Isometric drawing basics

A few points that help when you draw on the grid.

Isometric drawing and isometric projection

Both show a 3D object with three axes 120 degrees apart. A true isometric projection shortens lengths along each axis by about 0.82 (the square root of 2/3, roughly 0.8165). An isometric drawing skips the shortening and measures the true length, which makes the drawing about 22% bigger. The grid on this page is a guide for either.

Start from cubes

Complex shapes are easier to draw if you first break them into cubes. Build the shape in Stack cubes mode, check which faces are on top, left, and right, then copy the same outline onto paper or into your design tool.

Printing at the size you want

Print scales the whole canvas to the page, so a bigger canvas with the same cell size gives smaller cells on paper. Use the printed size shown under the export buttons to adjust the cell size until it matches the paper you need.

Why a grid does not look or print right

Jagged lines in pixel art

Drawing pixel art on a 30° grid gives lines that do not follow a regular pixel pattern, so edges look uneven.

💡 See the solution▼
Choose the 26.57° preset. Its 2:1 slope moves one pixel up for every two across.

Printed cells are the wrong size

The canvas is scaled to fit the page, so the printed cell size changes with the canvas size, the paper, and the cell size.

💡 See the solution▼
Check the printed size shown under the export buttons, and change the cell size until it is the size you want. Leave the scale in the print dialog on its default.

Dots do not appear

A small cell on a large canvas needs more than 60,000 dots, so the dots are not drawn.

💡 See the solution▼
Increase the cell size or reduce the canvas size until the notice disappears.

The guide disappears against your artwork

A blue grid on a blue or dark background is hard to see, even though it exports correctly.

💡 See the solution▼
Preview with Background set to Color to match your canvas, pick a line color that stands out, then switch back to Transparent before you export.

Isometric grid FAQ

Q.What angle is a standard isometric grid?

Q.

A. 30 degrees from the horizontal. At 30 degrees the three axes appear 120 degrees apart, which is why the grid defaults to it. The 30° button sets it, and you can type any angle from 10 to 60 degrees.

Q.What angle should I use for isometric pixel art?

Q.

A. Use 26.57°, which is the 2:1 ratio. Its slope rises 1 pixel for every 2 pixels across, so the lines land on whole pixels and stay clean. A 30° line does not follow a whole-pixel pattern, and it tends to look jagged at low resolution.

Q.How do I print isometric graph paper?

Q.

A. Choose a Letter or A4 canvas preset, pick Lines or Dots, and set the cell size. Select your paper size under the export buttons and click Print / PDF. The page shows about how large one cell side will be on paper. In the print dialog, leave the scale on its default so the grid is not resized again.

Q.How do I get isometric dot paper?

Q.

A. Switch Grid type to Dots. The dots sit on the same lattice points where the lines would cross. If the canvas and cell size would need more than 60,000 dots, they are not drawn and a notice asks you to increase the cell size or shrink the canvas.

Q.How do I save the grid as a PDF?

Q.

A. Click Print / PDF, then pick Save as PDF as the destination in the print dialog. The tool does not create the PDF itself, so the dialog is where you choose the file.

Q.What is the difference between isometric drawing and isometric projection?

Q.

A. Both use the same three axes, 120 degrees apart. An isometric projection shortens every length along the axes by about 0.82, while an isometric drawing uses the true lengths. The drawing therefore looks about 22% larger. The grid works as a guide for either.

Q.Can I draw cubes on the grid?

Q.

A. Yes. Switch to Stack cubes, then click a square inside the dashed area. Each click on the same spot adds a cube, up to 12 high. Choose Remove to take cubes away, and Undo to step back. The cube faces are shaded automatically, and the cubes are included in every export.

Q.How do I use the SVG in Figma or Illustrator?

Q.

A. Click Download SVG and open or import the file in your editor. Copy SVG puts the markup on your clipboard instead, and some tools accept it pasted onto the canvas. The grid is vector, so it stays sharp at any zoom, and you can lock it as a guide layer.

Q.How do I make a diamond grid without vertical lines?

Q.

A. Keep Grid type on Lines and turn off Show vertical lines. Only the two diagonal sets remain, which gives a diamond pattern.

Q.Is the PNG background transparent?

Q.

A. It is when Background is set to Transparent, so only the grid lines or dots and any cubes are visible. Set Background to Color and the PNG is filled with the color you pick. The PNG has the same pixel size as the canvas.

Q.Is anything uploaded to a server?

Q.

A. No. The grid is generated in your browser, and nothing you set or draw is sent anywhere.

User Feedback & Request

Your feedback
makes this tool better.

Tell us which features you'd like, what should be fixed, or which new tool you'd like to see. An engineer reads every submission and uses it to guide development.

Send feedback