Add a Border to an Image
Add a colored border, inner padding, rounded corners and a drop shadow to any image in your browser, with a transparent or colored outer background.
Runs entirely in your browser. Your data is never uploaded.
What is Image Border?
This tool frames an image with a solid border of any width and color, optional inner padding in a separate color, rounded corners and a soft drop shadow. The area outside the frame can stay transparent (useful with rounded corners and shadows) or be filled with a background color.
How to use Image Border
- Drop, choose or paste an image.
- Set Border width and Border color, and optionally Inner padding with its color.
- Add Corner radius and a Shadow size / offset if you like.
- Keep Transparent outside the border or choose a background color, then download (PNG keeps transparency).
Example
40×20 image, border 20 px #ff00ff, no padding, radius 0
80×60 PNG whose top-left pixel is #FF00FF
When to use Image Border
Use it to make screenshots stand out in documents, add a white “print” border to photos, or create rounded, shadowed images for social posts and slides. Use PNG output when you want transparent rounded corners or shadows; JPEG fills them with white.
How Image Border works
A new canvas is created that is larger than the image by twice the border plus padding, plus room for the shadow. A rounded rectangle is filled with the border color (with canvas shadow settings when a shadow is enabled), an inner rounded rectangle is filled with the padding color, and the image is drawn clipped to the innermost rounded rectangle, so the corner radius applies to the photo too.
Common Use Cases
- Adding a white frame to photos for an Instagram post.
- Giving screenshots a thin gray border in documentation.
- Creating rounded app-icon-style images with a shadow.
- Adding consistent padding around product images.
Security Note
Images are decoded, processed and encoded locally in your browser with the Canvas API. Nothing is uploaded to a server.
FAQs
Why are my rounded corners white?
JPEG cannot store transparency. Choose PNG or WebP as the output format to keep transparent corners and shadows.
How is the output size calculated?
Width = image width + 2 × (border + padding), plus extra space on each side when a shadow is enabled. Height works the same way.
Can I use a semi-transparent border?
The color fields accept 6-digit HEX colors, so borders are opaque. Set the border to 0 and use only the padding if you need a frame matching your background.