Image Cropper
Image Cropper
Upload an Image to Start Cropping
Drag and drop an image or click the upload zone on the left to load your photo. Then drag the handles to select your crop area and click Apply Crop.
Crop images in your browser — private, instant, no uploads
Cropping is one of the most fundamental image editing operations, and yet finding a tool that does it right — without unwanted server uploads, forced registration, or watermarks — has historically been frustrating. Our free online Image Cropper solves all of that. Every pixel of your image stays in your browser using the HTML5 Canvas API. Nothing is ever transmitted to a server, which makes it ideal for sensitive personal photographs, client files, or any image you want to keep private. The tool supports all major image formats including JPEG, PNG, WebP, GIF, AVIF, and BMP. Once you upload an image by dragging and dropping it onto the upload zone or clicking to browse, you are presented with a full interactive canvas displaying your image with a draggable crop overlay. The crop selection has eight handles — one at each corner and one at the midpoint of each edge — giving you precise control over both the size and the position of the crop region. You can also drag the interior of the box to move the entire selection without resizing it. A comprehensive set of aspect ratio presets lets you lock the crop to common proportions: 1:1 for Instagram square posts and avatars, 16:9 for YouTube thumbnails and widescreen video, 9:16 for Stories and Shorts, 4:3 for standard photographs and tablets, 3:2 for DSLR camera native output, 4:5 for Instagram portrait feed images, and many more including the cinematic 21:9 ultrawide and the classical 1.618:1 golden ratio beloved by photographers and designers. Social media platform presets go further by directly setting the exact pixel dimensions recommended by Instagram, YouTube, Facebook, Twitter/X, TikTok, LinkedIn, and Pinterest. Print size presets at 300 DPI cover 4×6 inches, 5×7 inches, 8×10 inches, A4, and US Letter. Beyond cropping, the tool includes a full set of image transformation controls. You can rotate the image in 90-degree increments clockwise or counterclockwise, flip it horizontally or vertically to mirror it, and use the straighten slider to correct a tilted horizon by up to 45 degrees in either direction. A zoom slider (25%–400%) lets you zoom in on the canvas for precision cropping of fine details. Circle crop mode generates a PNG with a transparent circular or elliptical mask — perfect for profile picture cutouts. The rule of thirds grid overlay draws three horizontal and three vertical lines over the crop area to help you compose shots according to the classic photographic principle that places your subject off-center for a more dynamic image. Pixel-precise coordinate inputs let you type exact X, Y, Width, and Height values that instantly update the crop box on the canvas, and the canvas crop box changes likewise update the numeric fields in real time. Output format can be switched between JPEG, PNG, and WebP at any time, and a quality slider for JPEG and WebP lets you balance file size against visual fidelity. An estimated file size is displayed live as you adjust the dimensions and quality. The undo history preserves the last five crop states so you can step back if you accidentally move the crop box. Keyboard shortcuts (R to rotate, H to flip horizontally, V to flip vertically, +/- to zoom, Enter to apply the crop, Escape to reset, and Ctrl+Z to undo) let experienced users work without touching the mouse. Once you apply the crop, the result is displayed in a before/after comparison view where you can toggle between the original and the cropped image. Output statistics show the final dimensions in pixels, the actual file size, the output format, and the megapixel count. Download the result directly to your device, copy it to your clipboard for pasting into other applications, share it via the Web Share API (or clipboard as fallback), or send it directly to your printer. The entire experience is designed to work smoothly on both desktop and mobile — touch drag events are handled the same way as mouse events on the crop canvas.
Understanding Image Cropping
What Is Image Cropping?
Image cropping is the process of selecting a rectangular (or circular) region of a source image and discarding everything outside that region. It is distinct from resizing — cropping changes the composition and aspect ratio of the image without scaling the remaining pixels. When you crop, the pixel density of the remaining area is unchanged; only the boundaries of the visible image are moved. Cropping is used to remove distracting elements at the edges of a photo, to reframe a subject, to match a required aspect ratio for a social media platform, or to prepare an image for printing at a specific paper size.
How Does Browser-Side Canvas Cropping Work?
This tool uses the HTML5 Canvas API to perform all image processing without any server interaction. After the user uploads an image, a FileReader converts it to a data URL, which is loaded into an HTML Image element. A hidden off-screen canvas applies any rotation and flip transforms using ctx.translate, ctx.rotate, and ctx.scale operations. The interactive crop overlay is drawn on a visible canvas using ctx.drawImage to render the image, a semi-transparent dimming rectangle over the entire canvas, a cleared rectangle revealing the crop region, white dashed stroke for the crop box border, and filled white squares for the eight resize handles. When the user applies the crop, a new output canvas is created with the exact crop dimensions, and ctx.drawImage is called with the source rectangle (cropX, cropY, cropWidth, cropHeight) to paint only the selected region. For circle crops, ctx.arc followed by ctx.clip constrains the drawing to a circular mask. The result is exported using canvas.toDataURL with the selected MIME type and quality level.
Why Aspect Ratio Matters for Social Media
Every major social media platform has specific recommended image dimensions and aspect ratios. Uploading an image with the wrong ratio causes the platform to auto-crop it — often cutting off faces or key content. Instagram's feed accepts square (1:1), portrait (4:5), and landscape (1.91:1) posts; Stories and Reels require 9:16. YouTube thumbnails must be 16:9 at 1280×720 pixels for best quality. Facebook post images render best at 1.91:1, and cover photos at 820×312. Twitter/X preview cards use 16:9, while the header banner is 3:1. TikTok is exclusively 9:16. By using the social media presets in this tool, you can ensure your image is cropped to exactly the right ratio before uploading, preventing unexpected auto-cropping and presenting your content exactly as intended.
Limitations and Tips
Because all processing happens in the browser using Canvas API, performance depends on your device. Very large images (over 20 megapixels) may be slow to render on older devices. The canvas element is subject to browser security restrictions around CORS — only images loaded from the same origin or from data URLs can be drawn and then exported; cross-origin images loaded by URL would require the server to send CORS headers. The straighten slider uses a rotate transform on the full canvas, which means the corners of the original image become visible as black areas when a significant angle is applied; for horizon correction, keep the angle small (under 5°) and use the crop box to trim the resulting corners. JPEG quality settings below 50% introduce visible compression artifacts; 80–90% is recommended for most use cases. The file size estimate is a mathematical approximation based on empirical compression ratios and will differ from the actual exported size by 10–30%.
How to Use the Image Cropper
Upload Your Image
Click the upload zone or drag and drop your image file onto the page. Supported formats include JPG, PNG, WebP, GIF, AVIF, and BMP. Your image is never sent to a server — all processing is done locally in your browser.
Select Your Crop Area
The image appears on an interactive canvas with a dashed crop box. Drag the eight handles — at the corners and edge midpoints — to resize the crop selection. Drag the interior of the box to move it without resizing. Use aspect ratio presets (Free, 1:1, 16:9, etc.), social media presets (Instagram, YouTube, etc.), or print presets for common paper sizes. For precise control, type exact pixel values in the X, Y, Width, and Height fields.
Transform and Fine-Tune
Use the Rotate CW / CCW buttons to rotate the image 90 degrees at a time. Flip Horizontal or Vertical to mirror it. Use the Straighten slider to correct a tilted horizon. Toggle the Rule of Thirds grid to help compose your crop. Zoom in with the slider for detailed selection on small areas.
Apply Crop and Download
Click Apply Crop to generate the final result. Use the Before/After toggle to compare the original with the cropped output. Choose JPEG, PNG, or WebP output format and adjust the quality slider. Then click Download to save the file, Copy to copy it to your clipboard, or Share to send it directly from your device.
Frequently Asked Questions
Is my image uploaded to a server?
No. This tool uses the HTML5 Canvas API to process your image entirely within your browser. The image data never leaves your device. There is no server upload, no cloud storage, and no third-party service involved in the cropping process. This makes it safe to use with sensitive personal photos, client images, confidential documents with embedded images, or any file you want to keep completely private. The only outbound network request is the initial page load for the tool itself.
What aspect ratios are available and which should I use?
The tool provides 15 ratio presets including Free (unconstrained), 1:1 (Instagram square, profile pictures), 4:5 (Instagram portrait feed), 9:16 (Stories, TikTok, YouTube Shorts), 16:9 (YouTube thumbnails, widescreen), 4:3 (standard photos, tablets), 3:2 (DSLR camera native), 21:9 (cinematic ultrawide), 3:1 (Twitter/X header), the 820:312 Facebook Cover ratio, and the 1.618:1 golden ratio. For social media, use the Social Presets tab which applies the exact recommended dimensions for each platform including Instagram, YouTube, Facebook, Twitter/X, TikTok, LinkedIn, and Pinterest.
How does circle crop work?
Selecting Circle mode switches the crop box to a square selection and applies a circular clip path when the crop is processed. The exported image is always a PNG file (regardless of your format selection) because PNG supports transparency — the areas outside the circle become transparent alpha pixels rather than a solid background color. This is ideal for creating circular profile pictures, avatar images, or any design element where you need a circular image that can be placed over different backgrounds without a visible square border.
What does the Straighten slider do?
The Straighten slider rotates the entire image by an arbitrary angle between -45° and +45° degrees. It is designed for correcting horizon tilt in landscape photographs — when the horizon line is slightly off-level, you can use the slider to rotate the image until the horizon is perfectly horizontal. Because rotation at non-right angles creates empty triangular corners, it is recommended to also use the crop box to trim those corners from the final result. For most horizon corrections, a small angle of 1°–5° is sufficient.
What is the Rule of Thirds grid and why use it?
The Rule of Thirds is a fundamental composition principle in photography and visual design. It divides the frame into a 3×3 grid of nine equal rectangles using two horizontal lines and two vertical lines. The four intersection points of these lines are called power points or crash points, and placing your subject's key elements — eyes in a portrait, the horizon in a landscape, a product in a commercial shot — on or near these intersections tends to produce a more visually engaging composition than centering the subject. Toggle the grid overlay while adjusting the crop box to align your subject with these points.
Can I undo a crop change?
Yes. The tool maintains a history of the last five crop box states. Click the Undo button (or press Ctrl+Z / Cmd+Z) to step back to the previous crop box position and size. This is useful if you accidentally moved a handle to the wrong position or want to compare two different crop frames. The undo history is cleared when you upload a new image or reset the crop. Applying the crop to generate the result image does not consume undo history — it only creates the output image while leaving the crop canvas state intact so you can refine and re-apply if needed.
Related Tools
Photo Filter
Apply color filters and effects to photos in your browser
Image Flipper
Flip images horizontally or vertically with one click
JPEG Compressor
Reduce JPEG file size without visible quality loss
Aspect Ratio Calculator
Calculate scaled dimensions while preserving aspect ratio
PPI Calculator
Calculate pixels per inch for screens and print