Split an Image Into Tiles

Set a tile size in pixels and the splitter above cuts your image into as many tiles of that size as it fits. It starts at 512 by 512. The count comes from the source dimensions rather than from you, and any edge tiles that fall short keep their real size.

Drop an image here

or , or paste with Ctrl+V

JPG, PNG, WebP, GIF, BMP and AVIF, up to 50 MB.

Split by
Grid

Your image never leaves your device. Splitting runs in your browser with the Canvas API.

What 512 × 512 px tiles give you

Computed by the splitter library at build time
Tile size512 × 512 px
Tiles from a 2048 × 2048 sprite sheet16 whole tiles, nothing left over
Tiles from a 4096 × 4096 sprite sheet64 whole tiles, nothing left over
Tiles from a 1920 × 1080 screenshot6 whole tiles, and 6 part tiles at the edge that are dropped unless you keep them

This mode inverts the usual question. Instead of choosing how many pieces you want, you choose how big each piece is, and the count falls out of the source.

That is how tiled systems actually work. Web map libraries expect 256 by 256 tiles. Game engines want power-of-two textures: 256, 512, 1024. Print mosaics work from a physical tile size that maps back to a pixel size at your chosen resolution. In all of those, the tile size is fixed by something outside your image and the count is whatever the image happens to produce.

A 4096 × 4096 source at 512 by 512 gives 64 tiles in an 8 by 8 arrangement. A 5000 × 3000 source at the same tile size gives 10 columns of 512 with a 9th column 392 pixels wide, and 6 rows with the last one 464 pixels tall. Edge tiles are not padded out to full size by default. They come out at their real dimensions, which is what you want for printing and mosaics and not what a texture atlas wants.

Tile names carry the row and column, so a script or a map library can address them by grid position without opening any of them.

The work happens on a canvas in this page, one tile at a time, so a very large source does not have to sit on a single oversized canvas.

What this split is used for

Web map tiles

Map libraries load a grid of small tiles addressed by row and column rather than one enormous image. Set the tile size your library expects, split, and the file names carry the grid position you need for the URL template. Square tiles and a source sized to a multiple of the tile size avoid ragged edges.

Texture atlases and game assets

Splitting a packed texture back into individual assets is a fixed-cell-size job, not a fixed-count one. Set the cell dimensions and every sprite lands in its own file. For sheets with padding or an offset before the first cell, the sprite sheet splitter adds spacing and offset controls on top of this.

Photo mosaic and tile prints

A photo split into small equal tiles and printed one per card or one per ceramic tile becomes a wall piece. Work backwards from the physical tile size and your print resolution to get the pixel size, then split. Edge tiles keep their real dimensions so you can plan the trim.

Break up a huge scan for processing

Very large scans and satellite images are slow to open and awkward to work with in one piece. Cutting them into fixed tiles gives you chunks that load quickly and can be processed in parallel. The row and column in each name lets you stitch results back together afterwards.

Tips

  • Common tile sizes are 256, 512 and 1024 pixels square, since map and graphics systems expect powers of two.
  • Edge tiles come out smaller than a full tile unless the source dimensions are an exact multiple of the tile size.
  • Resize or pad the source to a multiple of the tile size first if every tile has to be identical.
  • Tile names carry the row and column, which is what map libraries and stitching scripts need.
  • Use PNG for game and map tiles so edges stay lossless and transparency survives.

Frequently asked questions

How do I split an image into tiles?

Set the tile width and height in pixels in the splitter above, then drop in your image. The tool works out how many tiles fit across and down and cuts them all. Download them as a ZIP with row and column in each file name, ready for a map library or an engine.

What happens to the edges if the image does not divide evenly?

The right-hand column and bottom row come out smaller than a full tile, at their real pixel size. Nothing is padded or stretched by default. If you need every tile to be identical, resize or pad the source to an exact multiple of the tile size before splitting.

What tile size should I use?

Match whatever consumes the tiles. Web map libraries almost always expect 256 by 256. Game engines and texture systems prefer powers of two, usually 512 or 1024. For print mosaics, work backwards from the physical tile size and the resolution your printer needs.

How is splitting into tiles different from splitting into equal parts?

Equal parts starts from a count and works out the tile size. Tiles starts from a tile size and works out the count. Use tiles when something downstream fixes the pixel dimensions, and equal parts when the number of pieces is what matters to you.

Can tiles overlap?

Overlap is a print feature rather than a tiling one, so it lives in the print splitter, where sheets need a bleed to tape together. Tiles cut here butt up exactly with no overlap and no gap, which is what map libraries and texture systems expect.

How many tiles can I create at once?

The grid ceiling is 20 rows by 20 columns, so 400 tiles from a single source. That is plenty for a 10240 pixel square image at 512 pixel tiles. Larger jobs than that are usually better done with a script than in a browser tab.