How to Make an Image Grid Free (2x2, 3x3, 4x6) [2026]

What is an image grid and when do you need one?

An image grid is a single output image that contains multiple photos arranged in equal-proportion cells, laid out in rows and columns. A 2x2 grid has 4 cells in 2 rows and 2 columns. A 3x3 grid has 9 cells in 3 rows and 3 columns. Every cell is the same size, the photos are placed side by side with a consistent gap, and the result is one downloadable image.

This is different from a photo mosaic (where many small images tile to form one large image) and different from a freeform collage (where photos overlap or vary in size). An image grid is a structured, precise layout — the kind you see in printed photography contact sheets, Instagram multi-photo posts, press kits, product comparison pages, and team member galleries.

Common use cases for image grids

• Instagram feed posts. A 2x2 or 3x3 grid posted as a single image lets you show multiple photos in one post without the viewer needing to swipe. Popular for “round up” posts, event recaps, and product showcases.
• Photo contact sheets. A contact sheet is a printed grid of all photos from a shoot — typically 9 to 20 small thumbnails on one page. Used by film photographers, event photographers, and studios to review a shoot at a glance.
• Before-and-after comparisons. A 2-column grid places the before image on the left and the after on the right, making the difference immediately visible in a single shareable image.
• Product multi-angle views. E-commerce product shots placed in a 2x2 grid — front, back, side, and detail — give buyers a complete visual overview in a single image that loads faster and is easier to scan than four separate images.
• Press kits and media galleries. A 3x3 grid of editorial photos packaged as a single high-resolution image is a common format in press kits and brand media pages.
• Team member pages. A 2x3 grid of headshots is a concise way to introduce a team. One image instead of six separate images simplifies layout and reduces page complexity.

How a browser-based image grid maker works

The HTML Canvas API — a standard built into every modern browser — was designed exactly for image compositing tasks like this. Here is what happens when you create a grid with SammaPix Collage Maker:

1. You choose a layout preset. The preset defines the number of rows and columns and the proportion of each cell. A 4-grid (2x2) divides the canvas into 4 equal squares. A 9-grid (3x3) divides it into 9 equal squares. A 6-grid divides it into 6 equal rectangles.
2. You load images into each cell. Your browser reads each file using the FileReader API — a local file read with no network request. The image is decoded into an ImageBitmap in browser memory.
3. A single Canvas element is created. The canvas dimensions are calculated from the layout: total width = (cell width × columns) + (gap × (columns + 1)), and the same for height. At a typical output of 2400px, a 3x3 grid with an 8px gap gives each cell approximately 784px of width (2400 minus 4 gaps of 8px, divided by 3).
4. The background color fills the entire canvas. This sets the color for all gap areas and any letterboxing from contain mode. All pixels outside the cells are this color.
5. Each image is drawn into its cell via drawImage. The Canvas 2D context uses drawImage(img, sx, sy, sw, sh, dx, dy, dw, dh) to scale and position each photo into its allocated cell. In cover mode, the source rectangle is cropped to match the cell aspect ratio. In contain mode, the destination rectangle is shrunk to fit the full source image.
6. The canvas exports to a downloadable file. The canvas.toBlob() method converts the canvas to a JPEG or PNG file in browser memory. A temporary blob: URL triggers the browser download. Nothing is sent to any server.

The entire compositing pipeline — from reading your files to producing the downloadable grid image — happens inside your browser tab. On a modern laptop, a 9-photo 3x3 grid at 2400px output is composited in well under one second.

Grid layout presets: 2x2, 3x3, and more

SammaPix Collage Maker offers five layout presets. Here is what each one produces and when to use it:

Each preset produces a square output canvas by default, which is the most versatile format for digital sharing (works cleanly for Instagram 1:1, print squares, and most web contexts). If you need a different final ratio, export the square grid and use SammaPix Crop to Ratio to trim it to 4:5 for Instagram or 16:9 for a banner.

Gap and background color: controlling the look of your grid

The gap and background color are not minor details — they are the two parameters that most influence whether a grid looks professional or amateurish. Getting them right takes about 30 seconds but makes a significant difference.

Gap size: how much space between cells

The gap applies uniformly between all cells and around the outer canvas boundary. This means a 2x2 grid with a 10px gap has a 10px border around the entire grid plus a 10px separator between the four cells. The gap reduces the pixel area available to each cell — a larger gap means each photo gets fewer pixels in the cell.

• 0px gap, flush grid. Maximum image area. Clean and bold. Used by many Instagram accounts for a no-border editorial look. The photos share edges directly, so transitions between different photos can be jarring if they have very different colors at the edges. Best when the photos share a consistent color palette.
• 4 to 8px gap, clean separation. The most widely used range for social media. Enough gap to visually separate the photos without the background color becoming a dominant design element. Works well with both white and black backgrounds.
• 12 to 20px gap, editorial spacing. The gap becomes a visible part of the design. Common in editorial photography layouts, print lookbooks, and portfolio presentations where the white or black space between photos is intentional.
• 30 to 60px gap, contact sheet. The look of a printed proof sheet or museum contact print. Each photo sits in its own clearly defined space. Best with a white background and black-and-white or muted-color photos.

Background color: what fills the gaps

The background color fills every pixel that is not covered by a photo — the gaps between cells, the outer canvas margin, and any letterboxing from contain mode. Three choices dominate:

Cover vs contain fit: preserving composition vs filling the cell

Every cell in your image grid is a rectangle. Your photos rarely have the exact same aspect ratio as the cell. The fit mode decides what to do with the mismatch. This is the most important technical setting in the tool.

Cover fit: flush cells, center-cropped

Cover mode scales each photo so that it fills the entire cell — both width and height. If the photo is wider than the cell's aspect ratio, the left and right edges are cropped. If it is taller, the top and bottom edges are cropped. The crop is centered, meaning the center of the photo aligns with the center of the cell.

In a 3x3 grid with a mix of landscape (16:9) and portrait (3:4) photos, cover mode produces a uniform grid where every cell is completely filled with image content. No letterboxing is visible. The grid looks like a professional photo layout.

The tradeoff: subjects not at the center of the frame may be cropped. A portrait where the face is at the top of the frame, or a landscape where the key element is at the left edge, will lose content in cover mode. For those photos, consider using the Crop to Ratio tool to manually pre-crop the photo before adding it to the grid, giving you control over which part of the image fills the cell.

Contain fit: full photos, letterboxed cells

Contain mode scales each photo to fit entirely within its cell without any cropping. The full composition of the photo is always visible. Where the photo does not fill the cell — the top/bottom of a landscape photo in a square cell, or the sides of a portrait photo in a square cell — the background color fills the gap.

Contain mode is the right choice when no cropping is acceptable — documentary photography, editorial images with deliberate compositions, fine art prints, and client deliverables where the photographer controls the frame. With a consistent background color (white for a print-style look, black for a cinematic feel), contain mode looks intentional rather than accidental.

How to make an image grid step by step

Here is the full process from choosing your grid to downloading the file:

1. Go to sammapix.com/tools/collage-maker in Chrome, Safari, Firefox, or Edge. No account required.
2. Select your grid layout. For a 2x2 grid, choose the 4-grid preset. For a 3x3 grid, choose the 9-grid preset. For a 2x3 grid, choose 6-grid. The cell slots appear immediately.
3. Load your photos. Drag an image file onto each cell, or click a cell to browse your device. JPEG, PNG, WebP, GIF, and AVIF are all accepted. The files are read locally — nothing is uploaded.
4. Set the gap. Type a pixel value. For a clean social media look: 6 to 8px. For a flush grid: 0px. For a contact sheet: 30 to 50px.
5. Choose the background color. White for a clean look. Black for a dramatic look. Any custom HEX for brand color.
6. Select cover or contain. Cover for a flush, uniform grid. Contain to preserve the full composition of every photo.
7. Click Download. The Canvas composites the grid and exports a JPEG or PNG from browser memory. No network request occurs. The file downloads immediately to your device with no watermark.

Image grids for Instagram: the right settings for social

Instagram has specific characteristics that influence which grid settings work best. Here are the recommended configurations for the most common Instagram use cases:

Single post: 4-grid (2x2) with 6px white gap, cover mode

This is the most popular configuration for Instagram multi-photo summary posts. Four equal cells in a square canvas, a thin white gap, and cover mode for uniform cell fills. The result posts cleanly as a 1:1 Instagram feed photo. The white gap creates a subtle but visible separation that makes the grid feel organized rather than random.

Feed preview: 9-grid (3x3) with 0px gap, cover mode

Some Instagram accounts post a 3x3 grid as a single image to give followers a compact preview of nine recent photos at once — a weekly summary, a series recap, or a travel album overview. A 0px gap with cover mode gives this the densest, most visually packed feel. Alternatively, use the SammaPix Instagram Grid Splitter to split a single wide image into three equal portrait panels for a carousel — when viewed on your profile, the three posts tile together to form a panoramic strip across the grid.

Before/after: 2-grid with 4px black gap, cover mode

Side-by-side before/after posts work well as a 2-grid with a thin black or white gap. Instagram will display the full wide image in the feed. Cover mode keeps both cells completely filled, giving the comparison a clean professional look. Make sure both photos have the same height when resized, so the left-right comparison is fair. Pre-resize both to the same dimensions using SammaPix Resize Images before adding them to the grid.

Image grids for print: contact sheets and gallery layouts

For print use, the key difference is resolution. A 2400px canvas works well for digital sharing but is only 8 inches wide at 300 DPI — the standard for photo printing. For a larger print, aim for a canvas width of 3600px (12 inches at 300 DPI) or higher. If you are printing a contact sheet on standard A4 or letter paper, 2400px is more than sufficient for a small-format proof sheet.

For contact sheets, the classic look is a 3x3 or 4x4 grid with a white background and a 20 to 40px gap. Contain mode is typically preferred for contact sheets because photographers use them to review compositions — cropping would defeat the purpose. A thin black border around each cell (achieved by using a black background color with a gap of 2 to 4px, then a white outer gap) can simulate the look of a traditional darkroom contact sheet.

For gallery and portfolio print layouts, the 4-grid or 6-grid with a wider white gap (30 to 60px) and contain mode creates a clean, matted appearance. Each photo is presented with breathing room, similar to how photos are matted in a printed book or a fine art portfolio.

Free image grid makers that do not add a watermark

Searching for “free image grid maker” or “free photo grid” returns dozens of tools. The majority of them add their own branding to the exported image on the free plan. This is not always obvious until you try to download — the watermark appears on the downloaded file even when the in-browser preview looks clean.

The reason most free tools do this is business model: they use the watermark on free exports to advertise to anyone who sees the image. Removing the watermark requires paying for a plan. This is a reasonable monetization choice for tools that run server-side infrastructure. But for a client deliverable, a brand's social post, or any commercial use, a watermarked image is not usable.

SammaPix Collage Maker adds no watermark because it has no server-side infrastructure cost per image. The tool runs entirely in your browser. When you click Download, the Canvas API produces the grid image locally and your browser saves it to your device. The marginal cost of each grid export to the tool is zero — there is nothing to recoup with a watermark.

You can verify this yourself: download a grid, open it in any image viewer or editor, and inspect the pixels. No branding, no URL, no logo will be present. The only pixels in the image are your photos, the gap color, and the background — exactly what the canvas exported.

Browser-based vs upload-based image grid tools: honest comparison

Other tools for working with multiple photos

SammaPix offers several tools that pair naturally with the image grid maker:

• Collage Maker: the tool this article covers. Use it to make 2x2, 3x3, and other grids. See the full guide at Photo Collage Maker Online Free.
• Instagram Grid Splitter: divide a wide or tall image into equal portrait slices for an Instagram carousel. Use after creating your grid to split it for a multi-post grid effect on your Instagram profile.
• Resize Images: standardize the dimensions of your photos before adding them to the grid. When all source images share the same aspect ratio as the grid cells, cover and contain modes produce cleaner, more predictable results.
• Crop to Ratio: crop individual photos to the cell aspect ratio before adding them to the grid. Gives you control over exactly which part of each photo fills its cell — useful when cover mode would crop an important subject.
• Add Border: add a solid-color border around the finished grid image. Useful for a white frame effect before printing or sharing. See Add a border to an image online free.