Does the output have a transparent background?

Yes. The corners outside the circle are transparent in the exported PNG.

Is my image uploaded?

No. The circular crop is rendered on a canvas in your browser, so your image never leaves your device.

Round avatars and profile pictures for social media, forums, and apps.

What format is exported?

The result is exported as a transparent PNG so the rounded corners stay see-through on any background.

What size should a circular profile picture be?

Most platforms display avatars between 320 and 400 px, but upload a larger square such as 500×500 px or 1000×1000 px so it stays sharp when scaled. The image is cropped to a centered circle, so position the subject's face in the middle before exporting.

Why is my circle crop exported as PNG?

PNG is used because the area outside the circle must be transparent, and only formats with an alpha channel such as PNG or WebP can store transparency. Saving as JPEG would fill the corners with a solid color, breaking the round effect on colored backgrounds.

Can I add a border ring around the circle?

A circular crop produces the round cutout itself; to add a colored ring or outline, run the result through a border tool or image editor. Keeping the export as a transparent PNG ensures any ring you add later sits cleanly around the circle.

Circle Crop — Round Profile Picture Maker

How to use Circle Crop Image

Crop any image into a perfect circle with a transparent PNG background — ideal for round profile pictures, avatars, and circular thumbnails for social media and apps. The crop is centred on the image, using the shorter dimension as the diameter. All processing happens on a canvas in your browser; your image never leaves your device.

Upload your image using the file picker or drag-and-drop.
The tool automatically crops to a centred square using the shorter dimension.
A circular clip mask is applied, making everything outside the circle transparent.
Preview the round result against the chequered transparency background.
Click "Download Circular PNG" to save the transparent-background PNG.

Your data never leaves your device — 100% private processing.

Profile picture sizing: platform requirements

Most social platforms display profile pictures as circles regardless of your uploaded image shape, but uploading a pre-cropped circular PNG ensures precise control and eliminates unexpected cropping at the platform level. Optimal upload sizes vary by platform. Twitter/X and LinkedIn both display at 400×400 px and recommend square uploads. Facebook uses 170×170 px on desktop. GitHub profile pictures display at 230×230 px. Discord uses 128×128 px. For the sharpest result at any size, upload the largest available image — the canvas maintains the original pixel dimensions and the platform scales down.

Platform	Display size	Recommended upload
Twitter/X	48px (feed) / 200px (profile)	400×400 px
Facebook	170×170 px	180×180 px minimum
LinkedIn	400×400 px	400×400 px or larger
GitHub	230×230 px	500×500 px or larger
Discord	128×128 px	256×256 px or larger

Canvas clipping path for circular crop

The circular crop uses the Canvas 2D API's clipping path feature. A circular path is created with ctx.arc(centerX, centerY, radius, 0, 2π), then ctx.clip() is called to restrict all subsequent drawing to the interior of that circle. The source image is then drawn offset so its centre aligns with the circle's centre. Pixels outside the circle are never drawn, leaving them as transparent (alpha = 0) in the canvas. When exported as a PNG, the transparent region is preserved. JPEG export would fill transparent areas with black, which is why PNG is the only appropriate format for circle-cropped images.

Worked examples

Square source

Inputs: 1000×1000 px image

Result: 1000 px diameter circular PNG

Landscape source

Inputs: 1200×800 px image

Result: 800 px diameter circle (centred)

Glossary

Clipping path: A shape defined in the Canvas 2D context that restricts where drawing operations are visible — pixels outside the path are not rendered.
Alpha channel: The transparency component of each pixel, where 0 is fully transparent and 255 is fully opaque.
Transparent PNG: A PNG file containing pixels with partial or full transparency, allowing the background of the containing page to show through.
Avatar: A small, typically circular image used to represent a user on digital platforms.

Related Image Tools

Rotate Image

Rotate an image by 90°, 180°, 270°, or any custom angle and download it. Fast, private, in-browser. Free with no watermark.

Favicon Generator

Generate favicons in all standard sizes from any image. Download a ZIP of PNG icons (16–512px) plus the ready-to-paste HTML. Free, private, in your browser.

Crop Image

Crop images online by entering coordinates or choosing an aspect ratio preset. Free, private, browser-based image cropper. Supports JPG, PNG, and WebP.

Add Border to Image

Add a colored or solid border and frame to your photos. Choose width, color, and corner radius, then download. Free and private.

Resize Image

Resize any image online by pixels or percentage. Free, private, and instant — no upload needed, and the original aspect ratio is preserved.

Compress Image

Compress JPG, PNG, WebP images online. Reduce file size by up to 90% without visible quality loss. Free, private, runs in your browser.

Explore all Image Tools.

Circle Crop Image

How to use Circle Crop Image

Profile picture sizing: platform requirements

Canvas clipping path for circular crop

Worked examples

Glossary

Related reading

Frequently Asked Questions

Why use Circle Crop Image?

Common use cases

Get weekly tool tips & updates

Related Image Tools