Skip to content
ToolBoxGeniehome

Image Splitter

Image Tools · Added

Cut an image into any grid up to 20 by 20. The tile boundaries are computed as exact fractions and rounded once at each edge, so adjacent tiles always share an edge exactly and the pieces reassemble with no seam and no overlap — which matters, because a grid posted to a profile gets its seams inspected by everyone who scrolls past.

Or drop a file onto this box.

JPG, PNG, WebP, GIF, BMP or AVIF, up to 30.00 MB. It is decoded and cut up on your device — nothing is uploaded.

How to use the image splitter

  1. 1Drop an image onto the box or choose a file. It is decoded and cut up on your device.
  2. 2Set the rows and columns, or use one of the presets.
  3. 3Check the preview grid — every tile is shown at the position it came from.
  4. 4Click any tile to download it on its own, or use the button to download all of them.

Examples

A profile grid

Input
A square image, 3 × 3 preset
Result
Nine tiles, plus the order to post them in

A profile grid fills from the top left but each new post pushes the others along, so the last one uploaded lands top left.

A panorama for a carousel

Input
A wide photograph, 1 row and 3 columns
Result
Three frames that swipe together as one continuous image

When the pixels do not divide

Input
A 1000 px wide image in 3 columns
Result
334, 333 and 333 — spread one per tile rather than dumped on the last

Rounding a width and then multiplying it loses a column of pixels down the right edge.

About the image splitter

The rounding problem, which is the whole job

Splitting an image sounds like division and is not, because pixels are integers. The naive implementation divides the width by the column count, rounds, and uses that width for every tile — and any image whose width is not a multiple of the column count then comes up short. A 1000 px image in three 333 px columns leaves a one-pixel strip unaccounted for, and a 1000 px image in three 334 px columns overruns the canvas.

The fix is to round the boundaries rather than the sizes. Tile n runs from round(n × W / cols) to round((n+1) × W / cols), which guarantees that each tile starts exactly where the previous one ended, that the first starts at zero and the last ends at W, and that the leftover pixels are distributed one per tile instead of accumulating. It is two lines of difference and it is the difference between tiles that reassemble and tiles that nearly do.

Posting order, and why it is backwards

A social profile grid displays posts newest first, filling from the top left and pushing older posts along. So the tile that ends up in the top left is the one posted last, and a nine-tile grid has to be uploaded starting from the bottom right.

Getting this wrong is expensive, because the only fix is deleting the posts and starting again — and on most platforms deleting loses whatever engagement they had. The tool prints the order explicitly for a 3 × 3 rather than leaving it to be discovered afterwards.

It is also worth checking the platform's own cropping before committing. Several apply a square or a fixed-ratio crop to grid thumbnails, which will trim the edges of every tile; a design that relies on lines meeting exactly across the seams needs a margin to survive that.

Other things a grid split is for

Print tiling is the oldest use: cutting a poster-sized image into pages that a normal printer can handle, to be trimmed and taped. If that is the plan, remember this tool splits with no overlap at all — a print tiling usually wants a few millimetres of bleed on each piece to allow for trimming, which means splitting into fewer, larger tiles and cropping them separately.

Sprite sheets go the other way. A sheet of game frames laid out on a regular grid comes apart cleanly here, which is useful for inspecting or re-packing frames without opening an image editor. And in web work, splitting a very large image into tiles is still how zoomable maps and gigapixel viewers load only the part of the picture on screen.

Frequently asked questions

Do the tiles fit back together exactly?
Yes, and it is the one property a splitter has to get right. Each boundary is computed as an exact fraction of the full width or height and rounded once, so tile n ends precisely where tile n plus one begins. Every pixel belongs to exactly one tile, no pixel belongs to two, and none is dropped. Computing a tile width first and then multiplying it — the obvious approach — loses a strip down the right edge whenever the image does not divide evenly.
Why do some tiles differ by a pixel?
Because most images do not divide evenly by most grids. A thousand pixels in three columns is 333 and a third each, so one column has to be a pixel wider. This spreads the remainder one pixel per tile rather than adding it all to the last column, which keeps every tile within a pixel of every other. At normal viewing sizes the difference is invisible, and the alternative — one column noticeably wider — is not.
Is anything uploaded?
No. The file is decoded, drawn to a canvas and re-encoded entirely inside this page, using your browser's own image support. Nothing is sent to a server, nothing is stored, and closing the tab is all it takes to clear it. That is also why very large images can be slow on an older phone — the work is happening on your device rather than somewhere with more memory.
Why does the browser ask about multiple downloads?
Because a page saving several files at once is exactly what an unwanted download looks like, so browsers ask permission the first time and throttle a burst. The tiles are spaced a quarter of a second apart to stay inside that throttling, and you may see a permission prompt. Allowing it applies to this page only. If you would rather not, clicking each tile downloads it on its own.
What format do the tiles come out in?
The same format you put in — a JPEG in gives JPEGs out, a PNG gives PNGs. That means a JPEG source goes through one more generation of lossy compression, which is fine for a photograph and less so for a design with flat colour and hard edges. If the source is artwork rather than a photo, upload it as a PNG and the tiles stay lossless.

Related tools