HOW IT WORKS
How Overlay Crop Works
Overlay Crop combines one fixed output frame with independent controls for every source image. This is different from a basic batch crop that cuts the same coordinates from every file.
1. Add up to five source images
Choose JPG, PNG, or WebP files. Each file becomes a separate layer with its own position, zoom, rotation, opacity, visibility, and lock state. The selected image data is processed locally in the browser.
- Use the clearest image as the reference.
- Keep original files backed up.
- On memory-limited phones, start with two images.
2. Choose the final frame
Select a preset ratio or enter exact output dimensions. The frame represents the final file shape and size. Every layer will be exported through this same frame.
- Pick the destination before cropping.
- Do not confuse ratio with pixel dimensions.
- Use the smallest source crop to set a realistic output size.
3. Build the reference composition
Position the reference layer first. Decide subject scale, headroom, side margins, baseline, and horizon. Lock the layer when the composition is correct.
- Portraits: start with the eye line.
- Products: use the baseline and optical center.
- Rooms: use fixed corners and horizon lines.
4. Align the remaining layers
Lower the opacity of the selected layer and compare stable landmarks. Adjust scale before fine position. You can drag with a mouse or one finger, zoom with the wheel or a two-finger pinch, and type exact values when needed.
- Use two or more landmarks.
- Accept real perspective or pose differences.
- Restore opacity to 100% after alignment.
5. Review every image separately
Hide the other layers and inspect the active image at full opacity. Check all edges, orientation, transparency, sharpness, and the amount of empty space around the subject.
- Look for clipped hair, hands, product corners, and shadows.
- Check the output at the size where it will actually be displayed.
- Do not assume a large output number means better quality.
6. Export and verify
Download one image or a ZIP containing all layers. Open a downloaded file outside the editor and confirm dimensions, orientation, file type, and visual quality before publishing the whole set.
- Rename files clearly.
- Test the actual carousel, slider, catalog, or video.
- Keep the original files unchanged.
What the tool does not do
- It does not restore missing detail in a low-resolution source.
- It does not correct lens perspective or pose differences automatically.
- It does not permanently store or recover an editing session after the page is closed.
- It does not replace platform-specific legal, identity-photo, medical, or organizational requirements.
Testing and browser support
The workflow is designed for current desktop and mobile browsers with Canvas support. We test pointer drag, mouse-wheel zoom, touch drag, two-finger pinch, numeric controls, single export, and ZIP export. Very large camera files can still exceed mobile memory.