A 9 grid photo splitter divides one image into a 3 by 3 set of nine separate PNG tiles, and the Image Grid Splitter does exactly that: pick a local JPG, PNG, or WebP, type 3 in the row and column boxes, select Split image, then download nine numbered, full-resolution PNGs in reading order. The whole job — file decoding, pixel extraction, PNG encoding, and download creation — runs inside the current browser tab, so the source image is never uploaded to a server. Every source pixel is covered exactly once, which means a 1080 by 1080 photo produces nine 360 by 360 tiles rather than nine slightly cropped or stretched squares, and a 1200 by 900 photo produces nine 400 by 300 tiles rather than a set that drops a strip on the right or bottom edge. The boundaries are calculated from proportional integer coordinates, so adjacent tiles meet exactly with no overlap and no missing pixels, and the tool rejects any grid that would produce a zero-pixel tile rather than silently truncating the image.

9 grid photo splitter
9 Grid Photo Splitter for Pixel-Perfect Tiles

What a 9 Grid Photo Splitter Is Actually Doing

When you ask for a "9 grid" out of one image, you are asking for a 3 by 3 tile set in which the tiles are full-resolution PNGs rather than thumbnails, the tiles are individually downloadable, the tiles line up edge to edge with no overlap and no gap, and the tile order is predictable — top-to-bottom then left-to-right. The most important property is edge-to-edge coverage. If the tool crops a fixed-size square from the center of each cell, the outer edges of the photo end up lost. If it resizes each cell to a square first, the tiles are no longer at the photo's natural resolution. If it rounds widths to a "nice" number, you can lose a strip on the right or get a row of misleading squares.

The Image Grid Splitter avoids all three traps: it works from the photo's natural pixel dimensions, slices with integer boundaries, and assigns every pixel to exactly one tile. That predictable order matters in practice. A post that depends on the tiles being read in the right sequence — for example, when the nine tiles together reconstruct the full photo on a profile-style feed — has to be downloaded in that order, and the file names have to make the order obvious. The splitter names each output like photo-row-2-column-3.png, which keeps the tiles sortable and removes the ambiguity that appears when the last row or column is one pixel larger than the others.

Why the Image Grid Splitter Fits This Task

The Image Grid Splitter is built around the exact requirements of a 9 grid photo splitter and a few of the related grids people search for at the same time:

  • One local image in, one numbered tile set out. The input is a JPG, PNG, or WebP up to 25 MiB and up to 20,000 pixels per side and 40 megapixels total; the output is a list of PNG tiles with their exact width, height, and a download link.
  • A rectangular grid you control. Rows and columns can each be set from 1 to 10, so the same tool produces a 9-tile 3 by 3, a 16-tile 4 by 4, a 25-tile 5 by 5, and so on up to a 10 by 10 of 100 tiles.
  • Exact, pixel-true slicing. Boundaries are calculated from proportional integer coordinates, so a 10-pixel width split into four columns gives widths of 2, 3, 2, and 3 — every pixel covered once, no stretch, no blur, no interpolation.
  • Local-only processing. File decoding, slicing, and PNG encoding all run in the browser. The source is not uploaded to Lizely or anywhere else; the tool never sees it leave the tab.
  • Predictable, sortable names. Each file is named after the original base name plus row and column, so a 3 by 3 split of photo.jpg becomes photo-row-1-column-1.png through photo-row-3-column-3.png.

Because the slicing is local, the tool can be used on a private or work-sensitive photo without worrying about a server-side copy. Because every output is PNG, sharp edges and any source transparency survive, and the tiles are not paying a second round of lossy JPEG compression.

Splitting a Photo Into a 9 Grid Step by Step

The split itself is three actions:

  1. Choose a local JPG, PNG, or WebP within the displayed file and pixel limits.
  2. Enter 1 to 10 rows and 1 to 10 columns — for a classic 9 grid, type 3 in each box — then select Split image.
  3. Check each numbered tile's dimensions and download the PNG files you need.

When you select Split image, the tool draws each tile onto its own natural-size offscreen canvas using the browser's canvas drawImage routine, encodes that canvas to a PNG, and presents a list of every tile in top-to-bottom, left-to-right reading order. Each tile entry shows its exact width, height, and approximate encoded size, along with a download link. The MDN canvas drawImage reference describes how the browser copies only the source rectangle you give it, which is what guarantees the tiles are not stretched or filtered.

If the photo's width or height is not evenly divisible by 3, a valid 9-tile set is still produced. A 1000-pixel-wide image split into 3 columns comes back as three tiles in the neighborhood of 333 pixels wide, with the last column absorbing the one-pixel remainder; the three widths sum back to 1000 and no pixel is dropped. The same rule applies independently to the height, so a 1000 by 1001 image split into 3 by 3 produces a grid where the last column is one pixel wider than the other two columns and the last two rows are each one pixel wider than the first row, with no lost pixels anywhere. If a grid would push a tile down to zero pixels — for example, asking for 3 rows from a 2-pixel-tall image — the tool refuses the grid and shows a visible error rather than producing broken output.

Beyond the Classic 3x3: Other Grids This Tool Handles

The same tool covers a wide range of grid sizes because the rows and columns fields each accept values from 1 to 10 and the maximum tile count is 100. The table below summarizes the common layouts and the kind of source photo each one suits. The exact pixel size of each tile depends on the source photo; for any specific image, the tool shows the actual tile sizes.

GridRowsColumnsTile countTypical use
2 by 2224Square photo cut into four quadrants
3 by 2326Tall photo in three horizontal pairs
3 by 3339The classic 9 grid / nine-tile layout
4 by 44416Square photo cut into a denser tile set
5 by 55525Fine mosaic-style split
10 by 101010100Maximum supported; large mosaics

If the target is the standard nine-tile post, set rows to 3 and columns to 3. For a denser mosaic or a different aspect ratio, change the two numbers; the tile count and per-tile dimensions are recomputed from the source on every split.

How Uneven Pixel Counts Are Distributed

A 9 grid split is straightforward when both dimensions divide cleanly by 3. Real photos often do not — a phone portrait might be 3024 by 4032, a screenshot might be 1280 by 720 — so the splitter has to decide what to do with the leftover pixels. The Image Grid Splitter distributes them deliberately: each tile's width and height are calculated from proportional integer coordinates, the widest tile ends up at most one pixel wider than the narrowest, every source pixel lands in exactly one tile, and no narrow strip at the edge is silently discarded.

Take a concrete example. A 1200 by 900 image split into 3 rows and 4 columns gives 12 tiles. The width per column comes out as 300, 300, 300, 300 because 1200 divides evenly by 4. The height per row comes out as 300, 300, 300 because 900 divides evenly by 3. All 12 tiles are exactly 300 by 300, and 12 × 300 × 300 = 1,080,000 pixels, which matches 1200 × 900 = 1,080,000 pixels. The tile set is uniform because the source divides cleanly.

For uneven source dimensions, the splitter still produces a valid tile set. The rule is applied independently to width and height: every pixel of the source lands in exactly one tile, the widest tile is at most one pixel wider than the narrowest, the last row or last column absorbs any remainder, and no strip on the edge is silently dropped. So a 1000 by 1001 image split 3 by 3 produces a valid nine-tile grid where the last column is one pixel wider than the other two columns and the last two rows are each one pixel wider than the first row, with no lost pixels anywhere.

The naming scheme accounts for this. When the last row or last column is one pixel wider than the others, the file names — photo-row-3-column-3.png — make it obvious which tile is the extra-wide one, and the per-tile dimension readout tells you exactly by how much. There is no need to open the tiles to figure out which one is wider; the tool reports it before you download.

Where a 9-Grid Tile Set Actually Gets Used

The most familiar use case is a 3 by 3 post on a profile-style feed, where nine small tiles read together as one large image. The same idea also works for any layout that benefits from a single source photo broken into ordered squares or rectangles: a wallpaper divided into strips for a side-by-side collage, a long banner cut into a grid of social-ready tiles, a product photo split into separate crops for thumbnails, or a piece of artwork broken into manageable pieces for printing or sharing.

The reading-order naming makes a real difference in these workflows. If the tiles are intended to be uploaded in sequence, file names like photo-row-2-column-1.png sort correctly out of the box, and the per-tile readout lets you verify the order before you start uploading. If the tiles are for a layout where each one is used independently — for example, a 4 by 4 grid where each tile becomes a slide in a carousel — the named files still help keep track of which tile came from where in the source photo.

The Image Grid Splitter does not package the tiles as a ZIP, does not add bleed for printing, does not detect faces or panels in the source, and does not create overlapping or padded tiles. For those workflows — print bleeds, panel-aware extraction, ZIP delivery — a full editor with manual slice positions is the better fit. For a straightforward nine-tile set from one rectangular photo, this is the focused job.

Limits to Know Before You Click Split

A few constraints are worth flagging before you load a photo:

  • File type and size. Inputs are browser-decodable JPG, PNG, or WebP up to 25 MiB. Decoded images must stay within 20,000 pixels per side and 40 megapixels total. Beyond those limits, the tool refuses the input with a visible error rather than producing partial output.
  • Loss of source metadata. Because every output is PNG, a JPEG or WebP source is decoded and re-encoded as PNG; the visible pixel region is preserved exactly, but EXIF, XMP, ICC, and the original compression bytes are not carried over to the tiles.
  • Uniform rectangular grid only. The tool produces one rectangular row-by-column grid. It does not detect faces, snap to panels, produce overlapping or non-rectangular slices, or add gutters or borders between tiles.
  • No ZIP packaging. Tiles are downloaded one by one. If a single archive is needed, download them and zip them locally.
  • One image at a time. Each split processes a single source; switching sources or changing either grid value invalidates the previous result list, and temporary browser URLs are revoked when they are replaced.

If any of those limits are blockers — for example, the source EXIF must be preserved on every tile, overlapping slices are required, or more than 100 tiles are needed in one go — this is not the right tool. For a clean, ordered, locally-processed nine-tile set from one rectangular photo, the Image Grid Splitter is the focused option.

If you're weighing options, Image to ASCII on Android: Convert Photos in Your Browser covers this in detail.