How do I add rounded corners to an image without design software?

Drop the image here, drag the radius slider, download the PNG. The rounding is clipped into the file itself with transparent corners, so it works in any destination — no styling support needed.

How does the percentage radius relate to CSS border-radius?

Identically by design: the percentage applies to the image's short side, and when two radii on one edge would overlap, both scale down proportionally — the same resolution rule browsers use. A 10% radius here matches border-radius: 10% on a square element.

Can I make a circular profile picture from a rectangular photo?

Yes — circle mode crops the largest centred square and clips it to a disc in one step. The output is a transparent PNG that platforms without their own circular masking display correctly.

Why export PNG instead of JPG?

JPG has no alpha channel — rounded corners would be filled with a solid colour and show as a box on any other background. PNG keeps the corners genuinely transparent, which is the whole point of rounding.

Does rounding corners reduce image quality?

No. Pixels inside the shape are copied unchanged; only the corner regions become transparent. There is no recompression of a JPG's artefacts either, since the output is lossless PNG.

Round Image Corners

Clip any image to rounded corners or a perfect circle and export a PNG with true transparency — ready for avatars, app screenshots and slides.

Round Image Corners runs entirely in your browser using the canvas. Your images are processed on your device and never uploaded.

Open the Image Cropper

About Round Image Corners

Round Image Corners does what CSS border-radius does — but bakes it into the file, for all the places CSS cannot follow: slide decks, documents, chat apps, marketplaces and app-store screenshots. Drop an image, choose a preset from subtle to pill, or drag the radius slider; the radius works as a percentage of the image's short side and pairs of corners scale down together rather than overlapping, exactly the way browsers resolve border-radius. Circle mode centre-crops to a square first and clips to a perfect disc — the avatar workflow in one step. The export is a PNG with genuinely transparent corners, so the result sits cleanly on any background, dark mode included.

Features

Radius slider from 0 to 50% of the short side
Presets: subtle, medium, round and full circle
CSS-style corner overlap resolution — no pinched corners
Circle mode with automatic centred square crop
True alpha transparency in the exported PNG
Checkerboard preview so transparency is visible before download
Works with PNG, JPG and WebP input
Everything processed on your device

How to use the Round Image Corners

Drop an image or click to choose one
Pick a preset or drag the radius slider
Switch to circle mode for avatars
Download the transparent PNG

Example

Input

1200×800 screenshot · radius 10%

Output

PNG with 80 px rounded corners and transparent outside

10% of the 800 px short side — the same maths as CSS border-radius.

Common errors & troubleshooting

The corners show white instead of transparent in another app. — The transparency is real — some apps flatten PNGs onto white when pasting. Insert the file rather than pasting the image data, or check the destination's background settings.
The circle crop cut off part of the subject. — Circle mode centre-crops to the short side. Pre-crop the image so the subject is centred before rounding — a portrait's face rarely sits exactly at the middle of the frame.
A JPG came out larger after rounding. — Output is PNG, because JPG has no transparency. Screenshots compress well as PNG; large photos with rounded corners are inherently PNG-sized. Compress the result if bytes matter.
At 50% the shape is a pill, not a circle. — On a non-square image, 50% of the short side rounds the two short ends into semicircles — a pill. For a circle, use circle mode, which squares the crop first.

Frequently asked questions

How do I add rounded corners to an image without design software?: Drop the image here, drag the radius slider, download the PNG. The rounding is clipped into the file itself with transparent corners, so it works in any destination — no styling support needed.
How does the percentage radius relate to CSS border-radius?: Identically by design: the percentage applies to the image's short side, and when two radii on one edge would overlap, both scale down proportionally — the same resolution rule browsers use. A 10% radius here matches border-radius: 10% on a square element.
Can I make a circular profile picture from a rectangular photo?: Yes — circle mode crops the largest centred square and clips it to a disc in one step. The output is a transparent PNG that platforms without their own circular masking display correctly.
Why export PNG instead of JPG?: JPG has no alpha channel — rounded corners would be filled with a solid colour and show as a box on any other background. PNG keeps the corners genuinely transparent, which is the whole point of rounding.
Does rounding corners reduce image quality?: No. Pixels inside the shape are copied unchanged; only the corner regions become transparent. There is no recompression of a JPG's artefacts either, since the output is lossless PNG.

Related tools

Image Cropper — Crop an image to any area or fixed aspect ratio and download it, in your browser.
App Icon Generator — Turn one image into every iOS, macOS and Android app icon size — downloaded as a ZIP, in your browser.
Image Format Converter — Convert images between PNG, JPEG and WebP entirely in your browser.
Flip & Rotate Image — Rotate by 90° and flip images horizontally or vertically, then download — in your browser.
Image Watermark — Add a text or logo watermark to an image, anchored or tiled, with opacity and rotation.
SVG to PNG Converter — Convert SVG to PNG or JPG at any scale, with a transparent or solid background, in your browser.