Add Image Border

Add border to image paints a solid frame on all four sides and downloads a PNG. The width slider starts at 16 and the color starts at #3B82F6.

Sixteen pixels on a 100 by 50 picture

The canvas width is the picture width plus twice the border. The height is the picture height plus twice the border. A 100 by 50 picture at 16 pixels becomes 132 by 82. The frame is filled with the color first, then the picture is drawn at the border offset, so the picture sits inside the frame. The slider is labeled Border width (px). It runs from 1 to 80 in steps of 1, and it opens at 16. The color field is labeled Color and opens at #3B82F6. The button reads Download PNG. The file name ends with image-border.png, using the original name with the extension removed. A missing file shows Please upload an image.

Even sides, and what shows through

Every side uses the same width. There is no separate control for top or left. A transparent pixel in the picture shows the border color, because the canvas was filled before the picture was drawn. A JPEG is saved as PNG. The pixel size of the inner picture does not change. Only the canvas grows. There is no corner radius. There is no shadow. The color can be changed before download, and the preview redraws. Width 1 is the smallest frame. Width 80 is the largest. A 100 by 50 picture at 80 becomes 260 by 210.

How to check the frame

Upload a picture whose width and height you know. Leave the slider at 16. The preview should be 32 pixels wider and 32 pixels taller than the source. Change the slider to 1 and expect only 2 extra pixels on each axis. If one side is thicker than the other, the file did not come from this control. The download is a PNG even when the source was a JPEG. Keep the source if you still need the original size. Width 80 on a 100 by 50 picture is 260 by 210. The preview uses the color that is selected, which opens at #3B82F6.

The picture stays in the tab

The frame is drawn in this browser. The picture is not uploaded. The saved PNG uses the slider width and the color that are on screen at the moment you press Download PNG. Closing the tab drops the preview. The page does not remember the last file. Width 16 on a 100 by 50 picture adds 32 pixels to the width and 32 pixels to the height. Width 1 adds 2 pixels to each axis. The color control is a single field labeled Color. A JPEG photo still downloads as a PNG with the frame added. The inner picture is not scaled. If you need a different size, change that before you add the frame.