Image Circle Crop

What is an image circle crop?

A circle crop is an effect that cuts a rectangular image down to a perfect circular shape, removing the four corners entirely so only the inscribed circle remains. The circle is fitted to the shorter dimension of the original image — the image is first center-cropped to a square, and then that square is clipped to a circle whose diameter equals the square's side. The result is the classic round avatar or "profile picture" silhouette used across almost every modern app and social platform.

Because a circle removes the corners rather than drawing over them, the output depends on the file format. PNG and WebP support transparency, so the area outside the circle is fully see-through and the image can be placed on any background. JPG does not support transparency, so the corners are filled with a solid color (typically black) when the file is encoded. This tool performs the entire crop in your browser using the Canvas 2D API, so your images are never uploaded to a server.

How the circle crop tool works

This tool uses the browser's Canvas 2D API. After decoding your image, it computes the smaller of the natural width and height, then creates a square canvas of that size. The original image is center-cropped onto the square so the focal point of the photo stays in the middle. A circular clip path is then built with ctx.arc(size/2, size/2, size/2, 0, Math.PI * 2), and the image is drawn inside that clipped region with ctx.drawImage. Only the pixels inside the circle are kept — everything in the corners is cut away to transparency.

There are no sliders to adjust because the circle is always a perfect inscribed circle of the square. If your source image is already square, the result is a clean circle that uses the entire image. If the source is landscape or portrait, the longer dimension is evenly trimmed from both sides so the subject stays centered. PNG is the recommended output format because it preserves the transparent corners; WebP also supports transparency. JPG does not support transparency, so the corners are filled with black in the encoded file.

Source aspect ratios and the resulting circle

Because the circle is always inscribed in a square derived from the shorter side, the source aspect ratio determines how much of the image is kept. The table below shows what happens to common aspect ratios:

Source aspect ratio	What is kept	What is trimmed
1:1 (square)	The entire image	Only the four corners
4:3 (landscape)	Centered 3:3 square	Left and right edges
16:9 (widescreen)	Centered 9:9 square	More from left and right edges
3:4 (portrait)	Centered 3:3 square	Top and bottom edges
9:16 (story / vertical)	Centered 9:9 square	More from top and bottom edges

If you need to choose which part of the image stays inside the circle, crop the image to a square first using a dedicated cropper, then run it through this tool — the entire square will be used.

When to use a circle crop

Circle crops are the right choice whenever a round silhouette is expected or visually appropriate. Common scenarios include:

• Avatars and profile pictures. Almost every social platform (Twitter, Instagram, Facebook, LinkedIn, Discord, Slack) displays user avatars as circles — uploading a pre-cropped circle guarantees the framing looks right.
• Team and staff pages. Round headshots are the de facto standard for "About us" and team roster pages on company websites.
• Comments and testimonials. User photos next to reviews and comments are almost always circular.
• Logos and brand marks. App icons, favicons and partner logos often sit inside circular containers — a pre-cropped circle avoids awkward letterboxing.
• Stickers and decorative graphics. Circular cut-outs are popular in scrapbooking, chat stickers and decorative design elements.
• Print and merchandise. Round photos on badges, mugs, magnets and pins are easier to produce when the source file is already a transparent circle.
• Consistent gallery layouts. Mixing landscape and portrait photos into a uniform circular grid is a clean way to present varied imagery.

Whenever a round silhouette is needed, a one-click circle crop is the fastest way to get a clean, transparent result.

How to crop an image into a circle

Cropping an image into a circle with this tool takes only a second and runs entirely in your browser — no uploads, no sign-up, no watermark. The tool decodes your image locally, builds a circular clip through the Canvas API, and lets you export the result in the format you need. Follow these steps:

1. Upload your image. Click the upload area or drag and drop a JPG, PNG, WebP, GIF or BMP file. The image is decoded and previewed instantly.
2. Choose an output format. Pick PNG or WebP to keep the transparent corners, or JPG if you need a smaller file (the corners will be filled with black).
3. Click Apply Circle Crop. The tool center-crops the image to a square, clips it to a perfect circle, and shows the original and circle-cropped file sizes side by side.
4. Download the circle image. Click "Download Circle" to save the result. The original file stays untouched on your device.

Because every step runs locally in your browser using JavaScript, your image is never uploaded to a server. This makes the circle crop tool completely private, fast and suitable for sensitive or confidential images.