Splitting an image into a grid means dividing one source picture into a rectangular array of smaller, separate image files — for example, 3 rows and 3 columns of equal-size PNG tiles that read as one image inside an Instagram carousel post. Image Grid Splitter does this locally in your browser from a JPG, PNG, or WebP file: between 1 and 10 rows and 1 and 10 columns, with a hard ceiling of 100 tiles and no upload. Each output tile uses the source image's natural pixel dimensions, not a downscaled preview, so a 1200 by 900 photo split into 3 rows and 4 columns produces twelve 300 by 300 PNGs that, when reassembled in reading order, exactly recreate the original. The tool enforces this with proportional integer boundaries, which means a 10-pixel-wide source split into 4 columns becomes widths of 2, 3, 2, and 3 pixels — the four widths sum to 10, the difference between widest and narrowest is one pixel, and no thin strip is lost. The result list shows each tile's exact width, height, and approximate encoded file size, so you can spot the off-by-one tile at a glance and download the PNGs in the correct order for upload.
What splitting an image into a grid actually does
A grid split is just a rectangular tiling of one image. You choose how many rows and columns to divide the picture into, and the tool produces that many separate image files instead of one. Each file is a tile of the original, and the tiles fit together exactly so that, if you put them side by side again, you get the source picture back with nothing missing and nothing duplicated.
The concept is older than web apps — designers and printers have used grid slicing for decades to break large artwork into manageable pieces, fit images into a fixed page count, or build physical puzzles. Online grid splitters are popular today because the most common consumer reason for splitting is now social: a single wide photo that won't fit a square Instagram post gets cut into a 3 by 3 grid, uploaded as a carousel, and Instagram shows the tiles one at a time so the viewer sees the full image by swiping through the carousel.
For that use case — and for the related reasons like building photo comparisons, classroom posters, storyboard layouts, and the old "fragmented cover photo" trick — what matters is that the splits are precise, the file names tell you the upload order, and the tiles keep their full resolution. That's the brief for the tool we walk through below.
Common grid layouts and what they're used for
A 3 by 3 grid is the Instagram-standard split: nine square tiles that read as one image inside a carousel post. It's the most common search reason for "how to split image into grid," and the only thing you need from the source photo is a wide landscape image with a 3:1 aspect ratio. Cut that into three columns and three rows and you have nine equal squares, which Instagram accepts as a single carousel.
| Layout | Typical use case | Tiles produced |
|---|---|---|
| 1 by 2 | Side-by-side before/after comparison | 2 |
| 2 by 2 | Four-panel collage or comparison sheet | 4 |
| 3 by 2 | Six-panel storyboard or comic frame | 6 |
| 3 by 3 | Instagram carousel split of a panorama | 9 |
| 4 by 4 | 16-tile puzzle or grid poster | 16 |
| 5 by 5 | High-density puzzle or thumbnail grid | 25 |
These layouts are conventions, not hard rules — you can pick any combination from 1 by 1 (no split) up to 10 by 10, which is the tool's hard ceiling and produces 100 tiles. What changes between them is how many downloads you get and the shape of each tile. A landscape photo split 3 by 3 produces square tiles; the same photo split 4 by 3 produces wider rectangles; a portrait photo split 3 by 3 produces vertical rectangles. The tool always derives tile dimensions from the source image's actual pixel dimensions, not from a downscaled preview, so the tiles stay sharp at the resolution you started with.
How to split an image into a grid in your browser
The whole job is three steps in your browser. No upload, no account, no software install — the splitter decodes the file, draws the tiles on offscreen canvases, encodes them as PNGs, and hands you a list of download links.
- Pick a local JPG, PNG, or WebP. Use the file chooser on the tool page and select an image that lives on your computer. Files up to 25 MiB and images up to 20,000 pixels per side (40 megapixels total) are accepted; anything outside that range is rejected with a visible error before any work begins.
- Enter your rows and columns. Type a number between 1 and 10 for rows and a number between 1 and 10 for columns. The product of the two is the number of tiles you'll get, with a hard maximum of 100. For the Instagram 3 by 3, set rows to 3 and columns to 3.
- Select Split image. The tool calculates boundaries, draws each tile onto its own canvas at the source's natural pixel size, and lists every tile in reading order (top row first, left to right within each row).
- Check tile dimensions and download. Each tile in the result list shows its exact width and height in pixels along with an approximate encoded file size, plus a download button. Click the tiles you want (or download them all) and save them with the row-and-column names the tool assigns.
You can do this with the Image Grid Splitter in a couple of minutes. The result tiles are named with the original file's base name plus the row and column number — for example, photo-row-2-column-3.png — so they sort in upload order and there's no guessing which tile goes where in the grid.
How tile dimensions are calculated
Tile sizes come from the source image's natural pixel dimensions, not from any on-screen preview size. For an evenly divisible image the math is a straight division. A 1200 by 900 image split into 3 rows and 4 columns gives tile dimensions of 1200 ÷ 4 = 300 pixels wide and 900 ÷ 3 = 300 pixels tall. The result is 12 tiles of exactly 300 by 300, covering 1200 × 900 = 1,080,000 pixels in total — the same as the source, with no overlap and no missing pixels.
When the source dimensions don't divide evenly, the splitter uses proportional integer coordinates so every source pixel still belongs to exactly one tile and adjacent tiles meet without gaps. The product's own example: a source 10 pixels wide split into 4 columns becomes widths of 2, 3, 2, and 3 pixels. The four widths sum to 10, the difference between widest and narrowest is one pixel, and no thin strip is discarded. The same rule applies independently to the height: a 7-pixel-tall source split into 3 rows produces heights of 2, 2, and 3 pixels, which also satisfies the sum and the one-pixel rule.
The tool rejects any grid that would create a zero-pixel tile. Three rows from an image only 2 pixels tall is impossible, so the splitter shows an error rather than producing an empty PNG. This is deliberate — the design treats misleading output (a tile that's silently empty or a tile that's been padded to a common size) as worse than refusing the request.
File limits, formats, and how tiles are named
A few hard limits are worth knowing before you start, because the splitter enforces them upfront rather than producing broken output.
| Limit | Value | Why it exists |
|---|---|---|
| Supported inputs | JPG, PNG, WebP | The browser decodes these natively |
| Maximum file size | 25 MiB | Stops very large files from blocking the tab |
| Maximum pixels per side | 20,000 | Protects the offscreen canvas allocation |
| Maximum total pixels | 40 megapixels | Same protection, applied to area |
| Rows × columns | 1–10 each, up to 100 tiles total | Keeps the result list manageable |
| Output format | PNG, always | Preserves exact tile boundaries and source transparency |
Every tile is rendered on a canvas that matches the source rectangle's natural pixel size, then encoded as PNG. There is no resampling, no interpolation, no border or padding, and no recompression into a lossy format. A JPEG or WebP source is decoded and re-encoded, which means the original compression bytes and any source metadata (EXIF, ICC profile, XMP) are not retained, even though the visible pixel region is preserved exactly. For pixel-perfect fidelity and transparency, PNG is the right output; for a smaller file with lossy compression, you'd convert the PNGs to JPG afterward using a separate tool.
The file names follow a strict pattern: original-base-name-row-N-column-M.png. A photo called sunset.jpg split 3 by 3 produces files like sunset-row-1-column-1.png through sunset-row-3-column-3.png. Sorting them alphabetically matches the reading order on the result page, which matches the upload order for an Instagram carousel. If the last row or column happens to be one pixel wider or taller than the others — a 1201-pixel width split into 4 columns produces widths of 300, 300, 300, and 301 — the row-and-column naming keeps each tile's identity clear instead of leaving an off-sized tile anonymous.
Changing the source file or either grid value invalidates the previous result list, and the temporary browser URLs that back the download buttons are revoked as soon as they're replaced or you close the tool. Nothing persists beyond the current tab.
When a different tool is the better fit
The Image Grid Splitter is built for one focused job: a uniform row-by-column grid of one image, processed locally, with pixel-exact output. A few related tasks need a different tool because they ask for something the splitter deliberately doesn't do:
- Custom slice positions, bleed, or gutters. Print production and design templates usually need manual slice guides, overlap for seam trimming, or whitespace between tiles. Use an editor that supports manual slice positions instead.
- Detecting content automatically. Splitting a comic page by panel or a contact sheet by photo isn't a uniform grid. The splitter doesn't detect faces or content; it just divides by row and column.
- Overlapping slices. A panorama that's meant to overlap so the seams can be aligned isn't a clean grid split. The splitter's tiles meet exactly once with no overlap and no padding.
- Optimizing the output PNGs. The splitter preserves every pixel exactly and never recompresses, which keeps file sizes honest. If you want smaller PNGs after splitting, run them through a separate PNG optimizer or convert them to JPG.
For related operations that don't need slicing — resizing to a target dimension, cropping to a custom aspect ratio, compressing file size, or combining several images into one PDF — the image category has dedicated tools that work the same way: locally, in the browser, with no upload. The grid splitter's role is specifically the divide-by-rows-and-columns job, and it stays focused on that.