Circle Image Cropper

How to use

1. 1Drop an image (PNG, JPG, WebP, BMP, or GIF) into the dashed area or click to browse. Files up to 25 MB load directly in your browser.
2. 2Drag the preview to pan and slide the Zoom control (1x to 6x) until the part of the image you want fills the circle. Horizontal and vertical sliders work too.
3. 3Pick an output edge from the preset row (128, 256, 400, 512, 1024, 2048 px) or type any custom size from 32 to 4096 px.
4. 4Choose an output format (PNG for a transparent circle, JPG for an opaque file, WebP for modern small-size output) and adjust the background color if you want a solid fill instead of transparency.
5. 5Optionally enable the ring border for an avatar-style frame, pick a color and width, then click Crop and export and Download circle crop.

About this tool

Circle Image Cropper turns any rectangular image into a circular crop with a transparent background, ready to drop into a profile picture, an avatar, a logo mark, a Slack workspace icon, a Discord server avatar, a Notion or Linear page icon, an email signature, a presentation slide, or a UI mockup. Load a PNG, JPG, WebP, BMP, or GIF (the tool reads the first frame of an animated GIF) and a circular viewport opens over the image. Drag the preview to pan and use the zoom slider (1x to 6x) to push the circle around the part of the photo you want to keep; horizontal and vertical sliders give the same control with keyboard accessibility, and a one-click Center and fit button resets the framing. Pick an output edge from the preset row (128, 256, 400 for Discord, 512 for Slack, 1024, or 2048 pixels) or type any custom size from 32 to 4096 pixels. Choose PNG when you want a true transparent circle on a transparent square (the area outside the circle is clear alpha, exactly what you need for an avatar drop or a stacked layout in a design tool), JPG when the destination needs an opaque file (with a configurable background color filling the area outside the circle since JPG has no transparency), or WebP for the modern web format that keeps transparency at a smaller file size than PNG. A quality slider applies to JPG and WebP; PNG is always lossless. An optional ring border draws a colored stroke just inside the circle edge: pick any hex color and a thickness from 1 to 20 percent of the edge for an Instagram story style frame, a brand-colored avatar ring, or a UI ring around a profile photo. The crop is rendered with the browser's standard high-quality image smoothing using HTMLCanvasElement and ctx.clip on ctx.arc, which is how Chrome, Firefox, Edge, and Safari produce a smooth, anti-aliased circle edge without a JPEG halo or staircase aliasing. Source and output sit side by side after export with their pixel dimensions and file sizes shown, so you can verify the framing before downloading. Cropping runs entirely in your browser; the image is loaded into a local object URL and never sent to a server, which makes the tool safe for unreleased designs, client work, kids' photos, ID-style pictures, and any image you would rather not upload to a third-party service. Useful for resizing a profile photo into a round avatar for GitHub, LinkedIn, X, Bluesky, Instagram, TikTok, Reddit, Mastodon, Discord, Slack, and Microsoft Teams; building a circular team headshot wall for an About page; preparing transparent circular logo marks for a press kit or media page; cutting a round image for a podcast cover thumbnail; and answering the very common question of how to make a circle picture online without installing software.

Free to use. Works in your browser. No signup, no login.