An image grid splitter divides one picture into a rectangular set of numbered tiles, each exported as its own file. The Image Grid Splitter does exactly that for one local JPG, PNG, or WebP — turning it into up to 100 full-resolution PNG tiles without ever uploading the source to a server. You choose 1–10 rows and 1–10 columns, click split, and the tool calculates proportional boundaries with integer math so every source pixel ends up in exactly one tile. Each tile is rendered on a natural-size offscreen canvas and exported as a PNG, which preserves sharp pixel boundaries and any source transparency. The downloaded files follow a sortable naming pattern built from the source base name plus the row and column index (such as photo-row-2-column-3.png), and the result list also reports each tile's width, height, and approximate encoded size. Decoding, slicing, PNG encoding, and download creation all run in the current browser tab, so the source image never leaves your device.
Inputs, Limits, and File Rules the Tool Enforces
The splitter takes exactly one image at a time from your local file system. The accepted formats are JPG, PNG, and WebP — the three types that map directly to browser-decodable image data. Two hard caps protect the browser tab from unexpectedly large canvas allocations: the file itself must be 25 MiB or smaller, and the decoded image must stay within 20,000 pixels per side and 40 megapixels total. Anything outside those limits produces a visible error rather than a partial or falsely successful result.
The grid settings accept any combination of 1–10 rows and 1–10 columns, which gives a maximum grid of 10 by 10, or 100 tiles. The tool also rejects a grid that would create a zero-pixel tile — for example, asking for three rows from an image only two pixels tall. Invalid grid values, unsupported file types, empty files, decode failures, and failed PNG encoding all surface as visible errors instead of returning a broken download.
Here is a quick reference for the grid shapes the tool accepts and the number of tiles each one produces.
| Rows | Columns | Tile count |
|---|---|---|
| 1 | 2 | 2 |
| 2 | 2 | 4 |
| 3 | 3 | 9 |
| 3 | 4 | 12 |
| 4 | 5 | 20 |
| 10 | 10 | 100 |
For a 1200 by 900 source split into three rows and four columns, every tile measures exactly 300 by 300, giving twelve tiles total. The tool reads the image's natural pixel dimensions rather than any scaled preview size, so the numbers shown in the result list always match the real source. If your dimensions are not evenly divisible, the rule described below keeps adjacent tiles meeting exactly along shared edges.
Splitting a Local Image Into a Grid
- Choose a local JPG, PNG, or WebP from the file picker, confirming it sits within the displayed 25 MiB file limit and the 20,000-pixel / 40-megapixel decoded-image limits.
- Enter the number of rows and columns you want, each between 1 and 10, then select the Split image button.
- Check each numbered tile's dimensions and approximate encoded size in the result list, then download the PNG files you need individually.
How Tile Boundaries Handle Uneven Dimensions
When the image's pixel width or height is not evenly divisible by the chosen number of columns or rows, the tool does not silently round to a misleading common size. Instead, it calculates each boundary from proportional integer coordinates using floor(index × dimension ÷ count). For example, dividing a width of 10 pixels across four columns produces tile widths of 2, 3, 2, and 3. The widest and narrowest tiles differ by at most one pixel, the four widths sum to ten, and no narrow strip is discarded.
The same rule applies independently to the height. A 1001 by 1001 image split into three rows and three columns, for instance, produces nine tiles whose widths sum to 1001 and whose heights sum to 1001, with each individual tile varying from its neighbors by no more than one pixel in each direction. This keeps adjacent tiles meeting exactly along shared edges and guarantees that every source pixel belongs to one and only one tile.
Reading the Result List and Naming Files
After splitting, the result list shows every tile in top-to-bottom, left-to-right (row-major) order. Each entry reports the tile's width and height in pixels, its approximate encoded size, and an individual download link. The filename combines the original base name with the row and column index, so a file named photo-row-2-column-3.png is the second tile from the top in the third column from the left, drawn from a source file whose base name is "photo."
That naming convention keeps the files easy to sort in any file manager and removes ambiguity when the last row or column is one pixel wider or taller than the others. Because the tiles are numbered in reading order, posting them in sequence recreates the original arrangement. The download URLs are temporary browser object URLs that the tool revokes whenever you change the source image, change either grid value, or close the tab — so an old link stops working once a new split is generated.
Practical Uses for a Grid of Native PNG Tiles
The most familiar use for a grid splitter is the social-media carousel post, but the same rectangular grid of PNG tiles is useful in plenty of other situations. Designers can preview a single hero shot as a sprite sheet of square frames. Educators can split one labeled diagram into printable sections at native resolution. Game developers can export image tiles for a tile map without recompressing each piece. Anyone working with very large images can quickly preview small portions at their real pixel size rather than waiting for an editor to load the whole file.
Because every tile is exported as a PNG, the output keeps sharp pixel boundaries and any transparency the source had, which matters for sprite work, UI mockups, and diagrams with transparent backgrounds. If your real goal is one smaller file for an email attachment, the Image Compressor handles that case; if you need one resized master image instead of a grid of tiles, the Image Resizer is the closer fit. For a straightforward nine-grid post, set rows and columns to 3 and download the nine numbered results.
When the Splitter Is Not the Right Tool
The splitter is intentionally focused: one image, one uniform row-by-column grid, no overlap, no bleed, no automatic panel detection, no ZIP packaging, no PNG optimization. It is the right tool for routine rectangular splitting, but it is not a substitute for layout software when you need custom gutters, irregular panel sizes, or overlapping slices. For print production, social-network templates, or grids with custom guides and gutters, use an editor that supports manual slice positions.
Two specific behaviors are worth knowing before you start. First, because each tile is copied onto its own offscreen canvas without stretching, interpolation, filters, borders, padding, or recompression into a lossy format, the visible pixel region of every tile matches the source exactly — but a JPEG or WebP that is decoded and re-encoded as PNG does not retain its original compression bytes or metadata, even though the pixels themselves are preserved. Second, the source image is read directly from your device through the standard browser file API (see MDN's Using files from web applications for the underlying browser mechanism) and never travels anywhere else, which is why the splitter keeps working on a slow or offline connection once the page itself has loaded.
If a split produces an error, the cause is almost always one of four things: an unsupported file type, a file that exceeds the 25 MiB size limit, a decoded image that exceeds 20,000 pixels per side or 40 megapixels, or a grid that would create a zero-pixel tile. Adjusting the file or the grid and running the split again is normally enough to clear it.
If you're weighing options, Image Grid Splitter Alternative: Local, Lossless Tiles covers this in detail.