A seamless carousel is a geometry problem before it is an export problem.
If one portrait slide is 1080 × 1350 px, the master canvas must be an exact multiple of 1080 pixels wide:
master_width = slide_width × slide_count
master_height = slide_height
Examples:
| Slides | Master canvas |
|---|---|
| 3 | 3240 × 1350 |
| 5 | 5400 × 1350 |
| 7 | 7560 × 1350 |
Why seams break
The most common failures happen before slicing:
- The master image was resized to a width that does not divide into whole pixels.
- Text, faces, or logos sit directly on a cut boundary.
- Individual tiles are resized again after export.
- Filenames do not preserve the posting order.
- Different compression settings are applied to different tiles.
A reliable export workflow
- Choose the final slide ratio.
- Multiply the slide width by the number of slides.
- Add guides at every slide boundary.
- Finish the composition on the single master canvas.
- Export the master once.
- Split it into equal horizontal sections.
- Test the numbered pieces in an Instagram draft on the actual phone.
For private client artwork, the safest splitter is one that does not upload the source image. I built Image Splitter Online around that constraint: the image is processed locally in the browser, cut lines are previewed before export, and PNG, JPG, WebP, or ZIP output is available without an account.
A small implementation detail
If you are building your own splitter, distribute remainder pixels deterministically instead of rounding every tile independently. For a width W and N columns:
const base = Math.floor(W / N);
const remainder = W % N;
const widths = Array.from(
{ length: N },
(_, i) => base + (i < remainder ? 1 : 0)
);
That guarantees the exported widths sum back to the source width. It also avoids the one-pixel gaps or overlaps that appear when every cut boundary is rounded separately.
The final check is visual: reconstruct the row from the exported files and verify it matches the master exactly before publishing.
Top comments (0)