Crop any photo into a perfect circle, instantly
Drop your photo above, choose the circle crop shape, and download a clean, round PNG in seconds. No sign-up, no watermark, and nothing is ever uploaded to a server - everything runs right in your browser.
Round crops are the standard shape for profile pictures, avatars, and social media icons - Twitter/X, LinkedIn, Discord, Slack, GitHub, and most other platforms display profile photos in a circle anyway. Cropping to that shape yourself means the edges look perfect and nothing important gets clipped by the platform.
How to circle crop an image - step by step
- Upload your image. Click "Choose file" or drag your photo straight onto the tool. JPEG, PNG, and WebP all work.
- Select the circle shape. The tool should default to circle mode. If it doesn't, click the circle option in the shape selector.
- Adjust the crop area. Drag the circle to centre it on the face, logo, or subject you want to keep.
- Download the result. Click the download button to save a transparent-background PNG with your subject perfectly rounded.
Worked example - turning a rectangular headshot into a circular avatar
Input: a 1200 × 800 px JPEG headshot with extra background on each side.
What you do: Upload it, choose circle mode, drag the crop ring until the face fills the circle comfortably with a small margin around the head.
Output: a 800 × 800 px PNG where the face sits inside a crisp circle and the rest of the image is transparent. Upload that directly to LinkedIn or Slack and the edges are already perfect - no awkward square corners.
If the subject is off-centre in the original photo (common with smartphone snapshots), you can nudge the crop circle left or right before downloading, so you don't lose the nose or chin.
How to circle crop an image in Python or JavaScript
The browser tool above handles this in one click, but if you need to automate circular cropping inside a script, here are minimal, runnable examples.
Python (Pillow library)
# pip install Pillow
from PIL import Image, ImageDraw
def circle_crop(input_path, output_path, size=400):
img = Image.open(input_path).convert('RGBA')
img = img.resize((size, size)) # make it square first
mask = Image.new('L', (size, size), 0) # black = transparent
draw = ImageDraw.Draw(mask)
draw.ellipse((0, 0, size, size), fill=255) # white circle = keep
result = Image.new('RGBA', (size, size), (0, 0, 0, 0))
result.paste(img, mask=mask)
result.save(output_path, 'PNG')
circle_crop('headshot.jpg', 'avatar_circle.png')
The key idea: create a white ellipse on a black mask, then use that mask as the alpha channel so only the circular area is visible.
JavaScript (Canvas API, runs in the browser or Node with node-canvas)
// Browser version - paste into a script tag or DevTools console
function circleCrop(imageElement, size = 400) {
const canvas = document.createElement('canvas');
canvas.width = size;
canvas.height = size;
const ctx = canvas.getContext('2d');
ctx.beginPath();
ctx.arc(size / 2, size / 2, size / 2, 0, Math.PI * 2); // draw circle path
ctx.closePath();
ctx.clip(); // clip to circle
ctx.drawImage(imageElement, 0, 0, size, size); // draw image inside clip
return canvas.toDataURL('image/png');
}
ctx.clip() is the key call - it tells the Canvas API to discard anything drawn outside the circular path, giving you a round result with a transparent background.
How it works under the hood
The tool uses the HTML Canvas API built into every modern browser. When you upload an image, it is loaded into an off-screen canvas element. A circular clipping path is drawn using arc(), the image is composited inside that path, and the result is exported as a PNG with an alpha (transparency) channel.
Because the Canvas API is a native browser feature, none of your pixels ever leave your device. No image data is sent to any server. You can even disconnect from the internet after the page loads and the cropper will still work. The MDN Canvas API documentation covers the full spec if you want to go deeper.
When to use a circle crop - and when not to
| Use case | Best shape | Why |
|---|---|---|
| Profile photo / avatar | Circle | Most platforms mask to a circle anyway; do it first for pixel-perfect edges |
| App icon or logo badge | Circle | Rounded icons look native on iOS and Android home screens |
| YouTube / blog thumbnail | 16:9 rectangle | Widescreen thumbnails need the full rectangular frame |
| Instagram post | 1:1 square | Square fills the feed grid without letterboxing |
| Product photo with fine edges | Rectangle (no crop) | Circular clipping can cut off fine product details or text near corners |
Avoid circle cropping images where important detail sits near the corners - a group photo where someone stands at the edge, or a diagram with labels near the border. In those cases a square or custom rectangular crop preserves the content better.
PNG is the right output format for circle-cropped images because it supports transparency (the alpha channel that makes the background clear instead of white). JPEG does not support transparency, so saving a circular crop as a JPEG would give you a white-filled square instead of a round, transparent image.
Privacy - your images stay on your device
This tool runs entirely in your browser. Your photo is never uploaded, never stored, and never seen by any server. Close the tab and the image is gone. That makes it safe to use with private photos, internal headshots, or sensitive brand assets.
Ready to crop? Drop your photo into the tool at the top of the page, position the circle, and download your round image in one click.