Browser-Side Image Cropper with Aspect Ratio Presets
Upload any JPG, PNG, or WEBP image, choose a crop ratio, drag to reframe, and export the finished crop. This tool is designed for browser-side processing based on the current public implementation.
Drop image here or click to upload
Supported format: JPG / PNG / WEBP, max 12MB
No image uploaded
Natural image size
Waiting for image
Crop framing
Original
Browser-side crop workflow
Cropping and export are designed for browser-side processing based on the current public implementation. Avoid entering sensitive images unless you have reviewed the implementation.
- Drag the image, not the frame. The visible window is the final crop.
- Use Original when you want a clean trim without changing shape.
- Use PNG for crisp graphics and JPG/WEBP when smaller file size matters.
An image cropper trims a JPG, PNG, or WEBP image to a chosen frame, such as square, portrait, widescreen, or vertical story.
Cropping and export are designed for browser-side processing based on the current public implementation. Avoid using sensitive images unless you have reviewed the implementation.
Start with enough pixels
Cropping removes pixels, so use the highest-quality source image you have when preparing thumbnails, banners, or social assets.
Choose the final layout ratio
Use 1:1 for square thumbnails, 4:5 for portrait posts, 16:9 for banners, and 9:16 for vertical stories.
Marketplace and product cards
Trim excess background and reframe images so every product card looks consistent across the grid.
Social and content publishing
Prepare square, portrait, widescreen, or story-ready crops without jumping into a heavier design tool.
Internal docs and slides
Use clean crops for manuals, pitch decks, and screenshots when the original framing is too loose or distracting.
1. Pick the frame
Choose Original, 1:1, 4:5, 3:2, 16:9, or 9:16 depending on the destination layout.
2. Reposition the image
The exported crop uses the part of the source image visible inside the crop frame after zoom and drag adjustments.
3. Example, Assumption, and Limitation
A 1:1 crop is useful for product thumbnails. The tool assumes the crop frame is the desired output; cropping can remove pixels, but it cannot recover detail outside the original image.
Cropping before choosing the destination
Pick the target layout first. A 1:1 thumbnail, 16:9 banner, and 9:16 story need different framing.
Cutting too close to the subject
Leave breathing room for captions, rounded corners, platform overlays, and responsive crops.
Expecting lost pixels back
Cropping removes image areas outside the frame. Keep a copy of the original before exporting final assets.
Square thumbnails
Crop images to 1:1 for avatars, product grids, profile images, and preview cards.
Social media assets
Prepare 4:5, 16:9, or 9:16 crops for posts, banners, stories, and short-form covers.
Product and marketplace photos
Trim background space and keep items consistently framed across a listing grid.
Slides and documentation
Crop screenshots or photos before adding them to pitch decks, SOPs, manuals, or support docs.
Is this a browser-side image cropper?
Yes. The image cropper is designed for browser-side processing based on the current public implementation.
Do I need a backend to crop images?
This tool is designed to load, reframe, and export the image in the current browser session.
Can I crop an image to a square?
Yes. Choose the 1:1 preset to make a square crop for thumbnails, avatars, profile images, or product cards.
Which aspect ratio should I choose?
Use 1:1 for square thumbnails, 4:5 for portrait product or social assets, 16:9 for banners and video frames, and 9:16 for vertical stories.
Should I export PNG, JPG, or WEBP?
PNG is best for sharp graphics and transparency. JPG and WEBP usually create smaller files for photographs.
Suggested workflow
Visual asset prep path
Move from dimensions to crop, watermark, and scannable assets when preparing images for publishing.