How to use
This guide uses the editor’s own words. A sample photo is available if you want to try without your own file.
- Open one PNG or JPEG with "Choose an image", by dropping it on the page, or press "Try a sample image".
- Step 1, Mark: press "Draw on photo" and drag over the product and any text that must stay visible. Keyboard: focus the photo and press Enter, then move the box with the arrow keys. Exact numbers are under "Enter coordinates".
- Step 2, Check & adjust: the big image is what will be saved; dashed frames show the other two crops. Each small crop says Inside or Cut off and on which side.
- If a crop cuts the area, read the padding suggestion and press "Apply suggestion", or adjust padding, background and output size yourself. Undo restores the previous framing.
- Use "Before / after" to compare the original photo with the result at the same ratio.
- Step 3, Save: check the image, size and ratio, then press "Save PNG". Open the downloaded file and check it on your selling platform before publishing.
- Mark up to three separate areas. The three-format ZIP contains independently centred/refitted 1:1, 4:3 and 3:4 PNGs and a check report; it does not change the current edit. The 120/240px shelf is a simulation for your own reading, not a platform or automatic readability check. Download/load a style JSON containing only background, padding and output size, not photos or marked areas.
- The check table shows which ratio cuts the product, label or text and by how many output pixels in the current framing. The listing set independently refits each ratio. Extract the ZIP and open framekeep-review.html to inspect three PNGs with their size, padding and marked-area results. Open the adjustment panel for manual changes; Undo remains available.
What the marked box cannot tell you
The check only covers the box you mark. If something important sits outside it, the tool cannot see that it is missing.
Keyboard use
- Tab moves through every control in order.
- With the original image focused, arrow keys move the selected box by 1 px, Shift + arrow by 10 px, and Alt + arrow keys change its size.
- Ctrl + Z undoes and Ctrl + Shift + Z or Ctrl + Y redoes when focus is not in a text field.