Free collage layout
Calculate multi-image collage geometry, rotation, and SVG placeholders without pixel processing.
Runs in your browserEvery computation happens in your browser — your data never leaves this device.
Image sizes
Collage
Layout geometry and SVG preview
Enter sizes to see the result
What this tool does
- Plan collages
- Check bounds
Example
Input
100 100
Output
画布 1200 × 1200 · 布局 grid · 间距 16px · 每行 1 张
图片 1 张 · 文字 0 条 · 覆盖率 94.74%
所有图片都在画布内。
1. 100×100 @缩放11.68 中心(600, 600) 尺寸 1168×1168 旋转 0°
排版规则：缩略图按 contain 等比贴合单元格再乘缩放，旋转后按外接矩形判断是否越界；同一输入与种子结果固定。
预览 SVG：
<svg xmlns="http://www.w3.org/2000/svg" width="1200" height="1200" viewBox="0 0 1200 1200" role="img">
<rect x="0" y="0" width="1200" height="1200" fill="#F3F4F6" />
<g transform="rotate(0 600 600)">
<rect x="16" y="16" width="1168" height="1168" fill="#ffffff" fill-opacity="0.65" stroke="#9ca3af" stroke-width="2" />
<text x="600" y="606" font-size="20" fill="#374151" text-anchor="middle">1</text>
</g>
</svg>Enter source image width and height per line.
Frequently asked questions
Does it read images?
No, it uses dimensions only.
Is rotation supported?
Yes, with bounding-box checks.
What is output?
Geometry data and an SVG placeholder preview.
Keywords：拼图collage布局旋转SVG