frame it

Image Border & Rounded Corners

Add a frame, round the corners, keep the background transparent — and see it before you save.

frame it

☞ runs entirely in your browser — nothing is uploaded

Drop your image here

or click to browse — PNG, JPG, WebP or GIF

percent, not pixels

A frame that looks the same at every size

Both the border and the corner radius are set as a percentage of the shorter side rather than in pixels. That is the difference between a setting that travels and one that does not: forty pixels of rounding is invisible on a 4000-pixel photo and swallows half the subject on a 400-pixel avatar, while four percent looks like four percent on both. The readout still shows the pixel value it worked out, for when you need the exact number.

The corners are cut with two concentric paths — the outer edge at the radius you chose, the image inside it at that radius minus the border width — so the frame keeps an even thickness around the curve instead of bulging at each corner. Outside the rounded shape, PNG and WebP leave real transparency; JPG cannot, so it gets the background colour you pick, which is why the option turns itself off when you switch to JPG.

three steps

How to add a border to an image

01

Drop the image in

PNG, JPG, WebP and GIF are decoded in your browser. A profile photo or a screenshot you have not published stays on your machine.

02

Set the frame and the corners

Choose the border width and colour, then how far to round the corners. At fifty percent on a square image the result is a circle, which is what an avatar usually wants.

03

Pick a format and save

PNG or WebP keeps whatever is outside the rounded corners transparent. JPG fills it with the background colour instead, because JPEG has no transparency at all.

quick answers

Image border FAQ

Why is the border set in percent instead of pixels?

So one setting works on any image. A border measured in pixels looks like a hairline on a large photo and like a picture frame on a thumbnail; a percentage of the shorter side looks the same on both. The pixel value it comes out to is shown next to the preview.

How do I make a circular avatar?

Crop the picture to a square first, then set the corner radius to fifty percent — at that point the rounding meets in the middle of each side and the shape is a circle. Keep PNG or WebP so the outside stays transparent.

Why did my rounded corners come out black?

That happens when the format is JPG, which has no transparency, and no background colour was chosen. Here the transparency option switches off by itself for JPG and the corners take the background colour instead, so you never get black wedges by accident.

Does the image get cropped?

No. The border is added around the picture rather than over it, so the output is larger than the input by twice the border width. Nothing of the original is covered except the parts the rounded corners cut away.

Is the picture re-encoded?

Yes — the framed result is a new file. PNG and WebP are effectively lossless here, while JPG re-encodes at high quality. If the original is a JPG and you export as JPG, expect a normal second-generation loss.

What is the largest image I can use?

Up to 25 MB. Adding a wide border makes the canvas bigger, and browsers cap how large a canvas can be, so a very large photo with a very wide frame is scaled down to fit — the size line says so when that happens.

Can I use it on an animated GIF?

The first frame is used and the result is a still image. Animation cannot survive this tool; if you need a moving image, frame the frames before assembling them with Images to GIF.

Are my images uploaded?

No. The picture is decoded and redrawn inside your browser, and the result goes straight to your downloads. There is no server in this tool to send a photo to.

Is this free?

Yes — free with no watermark.