Turn a batch of photos into a polished collage. Choose a layout, hit Randomize, fine-tune the result, then export a high-resolution PNG or JPEG.
Collager runs entirely in the browser. There is no application server, account, upload, or build step. Photos remain in memory on your device; only editor settings are saved to local storage.
- Import JPEG, PNG, WebP, and GIF images using the file picker, drag and drop, or paste.
- Build with eight layout engines: Mosaic, Grid, Masonry, Rows, Brick, Hero, Scatter, and Orbit.
- Reproduce layout structure and photo assignment with deterministic seeds.
- Lock photo order, layout engine, structure, style, or background while randomizing.
- Swap photos between cells, cycle images, and reposition crops directly on the canvas.
- Target Instagram square, portrait, landscape, Story/Reel, A4, or custom canvas sizes.
- Preview Story/Reel safe zones and split artwork into correctly ordered 3 × 3 or 3 × 1 Instagram grid tiles.
- Export PNG or JPEG files at 1× or 2× resolution.
- Work on desktop or mobile with a full-width canvas and an off-canvas controls drawer.
Use the hosted version, or serve the repository with any static file server. For example:
python3 -m http.server 8000Then open http://localhost:8000.
You can also use an npm-based static server:
npx serve .No installation or compilation is required.
On desktop, editor controls stay in the left sidebar. On screens up to 760 px wide, use the Controls button to open the mobile drawer without shrinking the collage preview.
- Randomize: create a new result while respecting the active locks.
- Select two cells: swap their photos.
- Double-click a cell: cycle to the next photo.
- Drag inside a selected cell: reposition its crop.
- Export: choose the format, scale, and JPEG quality before downloading.
| Action | Shortcut |
|---|---|
| Randomize | R |
| Undo | Ctrl+Z / ⌘Z |
| Redo | Ctrl+Shift+Z / ⌘⇧Z |
| Toggle help | ? |
| Close an open panel or drawer | Esc |
Photo decoding, layout, rendering, and export happen locally with browser APIs. Collager does not transmit or persist imported photos. Seeds and editor options are stored in localStorage so the interface can restore your last settings.
Plain HTML, CSS, Canvas, and JavaScript ES modules, plus Tailwind CSS via CDN. There are no dependencies to install and no bundler.