{{ summaryTitle }}
{{ summaryValue }}

{{ summaryLine }}

Source {{ sourceBadge }} Format {{ formatLabel }} Coverage {{ coverageBadge }}
Drop or browse one image up to 12 MB, 8192 px per side, and 16 megapixels.
{{ sourceDropTitle }} {{ sourceDropLine }}

{{ sourceStatus }}

The sample is generated locally and contains only colored blocks.

{{ sourceFile.name }} · {{ sourceWidth }} × {{ sourceHeight }} px · {{ formatBytes(sourceFile.size) }}
Whole rows from 1 to 12.
Whole columns from 1 to 12.
Every tile in the ZIP uses the selected format.

{{ workflowMessage }}

The neutral default names tiles row by row.
px
The neutral default is 0 px; use up to 100 px.
The neutral default balances whole-pixel rounding across the grid.
%
The neutral default is 92%. PNG output is unchanged.
Tile package
{{ computation.values.artifacts.image_tile_package.value }}
{{ row.label }}{{ row.display }}
{{ tile.index }}

Showing the first {{ tilePreviews.length }} of {{ computation.values.tile_count }} ordered tiles.

The chart renderer is unavailable. Exact rectangles remain available in the tile ledger.

OrderRowColumnXYWidthHeightFilenameCopy
{{ tile.index }}{{ tile.row }}{{ tile.column }}{{ tile.x }} px{{ tile.y }} px{{ tile.width }} px{{ tile.height }} px{{ tile.filename }}
Image Cropper Crop one image locally with exact aspect and pixel controls, then review upscaling and transparency along with quality or file-budget risks.
Image Resizer Resize one image locally, compare fit or crop geometry, and tune format quality against a file-size target before downloading.
Image Compressor Compress one image locally in your browser, compare size and visual quality, then download a resized or reformatted copy with metadata controls.
Image Format Converter Convert one image locally with format, resize, crop, quality, and transparency controls while checking the actual output and byte size.

Image grids divide one bitmap into rectangular tiles for carousels, sprite sheets, print panels, mosaics, or editing handoffs. Unlike a resize, splitting keeps source pixels at their original scale. Unlike a single crop, it returns an ordered set of rectangles that covers the available image area.

Pixel dimensions are whole numbers, so an image width or height may not divide evenly by the requested grid. A 10-pixel width split into three columns cannot produce three identical integer widths. The extra pixel must be distributed across the grid or assigned to the final column.

Choice What changes What stays the same
Balanced remainder Indivisible pixels are spread across tile sizes. Every available source pixel belongs to one tile when gutter is zero.
Remainder in last tile Earlier tiles keep the floored size; the bottom or right tile receives the remainder. The overall available area is unchanged.
Excluded gutter Rows and columns of source pixels between tiles are deliberately omitted. Tiles are not resized to hide the gap.
Row-first or column-first order Numeric filenames and ZIP entry order change. Tile rectangles and image content do not change.

Output format affects the pixels after each rectangle is cut. PNG preserves transparency and ignores the lossy quality setting. JPEG fills transparent areas with white and uses lossy encoding. WebP can preserve transparency, but successful WebP output depends on the browser encoder.

Splitting cannot invent bleed, repair seams, align subjects across cuts, or guarantee that a social platform will display tiles without its own cropping. Check the exact cut map and downstream aspect-ratio rules before publishing.

How to Use This Tool:

Choose the source image and grid dimensions before deciding how tile boundaries and output formatting should work.

  1. Choose one PNG, JPEG, or WebP Source image. The file may be up to 12 MB, 8,192 pixels per side, and 16 megapixels after decoding.
  2. Set Rows and Columns from 1 through 12. Their product may not exceed 64 tiles.
  3. Select Tile format. Use PNG when transparency or lossless output matters; choose JPEG or WebP when a lossy delivery format is appropriate.
  4. Open Advanced to set filename order, excluded gutter width, remainder-pixel policy, and lossy quality. Quality applies only to JPEG and WebP.
  5. Choose the split action. If the gutter leaves less than one pixel for any tile row or column, reduce the gutter or the number of grid divisions.
  6. Review Image tile package, Cut map, and Tile ledger. Confirm coverage, rectangle coordinates, dimensions, and naming order before downloading the ZIP.

Interpreting Results:

Coverage is complete when every source pixel belongs to a tile. A nonzero Excluded pixels value is expected when gutter is greater than zero; those pixels are omitted rather than copied into either neighboring tile.

Use the tile ledger to verify each rectangle's x, y, width, and height. One-pixel size differences are normal when a dimension does not divide evenly. The selected remainder policy determines where those differences appear.

Preview quality is not a promise of identical file size or encoding across browsers. For JPEG output, check formerly transparent edges against the white fill. For WebP, confirm that package creation succeeded before relying on that format in a downstream workflow.

Technical Details:

Grid geometry is planned before any tile is encoded. The source width and height are reduced by the pixels reserved for internal gutters, then each available axis is divided into integer segments. Every tile uses one horizontal segment and one vertical segment.

Formula Core:

For source width W, source height H, columns C, rows R, and gutter g, the available dimensions remove one gutter between every neighboring pair.

Ax=W-(C-1)g Ay=H-(R-1)g

The tile count is rows multiplied by columns and must be at most 64. Each available dimension must also be at least the number of segments on that axis, which guarantees a minimum tile width and height of one pixel.

N=RC≤64 Ax≥C Ay≥R
Policy Segment boundaries Effect
Balanced Round iA/p for each boundary from 0 through p. Remainder pixels are distributed, so segment sizes differ by at most one pixel.
Last tile Use floor(A/p) for all earlier segments. The final segment receives every leftover pixel.

Transformation Core:

  1. Validate the PNG, JPEG, or WebP file signature and decode the oriented source image.
  2. Calculate whole-pixel source rectangles, excluded gutter coverage, traversal order, and stable filenames.
  3. Copy each source rectangle to a canvas of the same width and height, so splitting does not rescale the tile.
  4. Encode the canvas as PNG, JPEG, or WebP. JPEG first receives a white background; the lossy quality request is converted from 10 to 100 percent into the browser's 0 to 1 quality value.
  5. Place the encoded tiles and a manifest in one ZIP package using the selected row-first or column-first order.

Tile area equals available width multiplied by available height. Excluded area is source area minus tile area, so it counts the full union of horizontal and vertical gutter strips without double-counting their intersections.

Privacy Notes:

The selected image, decoded pixels, tile canvases, and ZIP package stay in the current browser tab and are not uploaded. Removing or replacing the source clears the current result. The page may still need network access to load its ZIP and chart libraries, but image data is not sent to those library hosts.

Worked Examples:

Balanced 10 by 7 pixel source

Split a 10 by 7 pixel image into 2 rows and 3 columns with no gutter. Balanced rounding produces column widths 3, 4, and 3 pixels and row heights 4 and 3 pixels. All 70 source pixels are covered by six tiles, with no excluded area.

References: