Add Border to Image Online

Create a custom border around your photo, screenshot or graphic. Adjust the thickness, select a color, choose inside or outside placement, and download your finished image.

✓ Free image editor ✓ Live preview ✓ PNG, JPG & WebP ✓ No sign-up required

Add a Custom Image Border

Upload an image to start. Your border is drawn using your browser’s Canvas feature, and you can preview the result before saving.

Choose an image or drag it here JPG, PNG or WebP · Maximum file size 20 MB
20 px
Select an image to begin.
Useful tip: Choose an outside border when you want to preserve the entire original image. Choose an inside border when the output must retain its existing dimensions.

How to Add a Border to an Image

  1. Choose a file: Select a JPG, PNG or WebP image.
  2. Adjust thickness: Set the border width between 0 and 200 pixels.
  3. Select a color: Choose the shade that works best with your image.
  4. Choose placement: Use outside to expand the canvas or inside to preserve dimensions.
  5. Review the preview: The image updates when you change border settings.
  6. Download: Select PNG, JPG or WebP and save the finished image.

Inside vs. Outside Borders

Border placement determines whether the image’s final dimensions change.

Outside Border

Adds a colored frame around the original image without covering its existing pixels. The canvas becomes larger.

Inside Border

Draws a colored frame over the outer edges of the image. The canvas remains the same size.

Example: 1200 × 800 Image

With a 20-pixel outside border, the output is 1240 × 840 pixels. With an inside border, the output remains 1200 × 800 pixels.

For outside placement, the formula is: output width = original width + (2 × border thickness). The same formula applies to height.

Practical Uses for Image Borders

A border helps separate visual content from its surroundings. It is particularly useful when an image and its background share similar colors.

  • Product images: create a consistent presentation for a catalog.
  • Social media: give a collection of graphics a recognizable frame.
  • Screenshots: make the edges visible on white websites and documents.
  • Presentations: distinguish photos from slide backgrounds.
  • Educational diagrams: clearly separate illustrations from explanatory text.

For printed materials, confirm the printer’s trim, bleed and resolution requirements. A digital border is not a substitute for professional print preparation.

Choosing the Right Download Format

PNG

Recommended for screenshots, diagrams, logos and images that require transparency. PNG uses lossless compression for the exported image.

JPG

Useful for photographs and broad compatibility. JPEG does not support transparent pixels, so transparent regions are filled with white during export.

WebP

Suitable for modern websites and efficient image delivery. Compression results vary depending on the source and browser encoder.

Adding a border does not improve the sharpness or resolution of the original image.

Image Privacy and Technical Limitations

This editor uses JavaScript and HTML Canvas to process the selected image in your browser. The border-processing code does not send the selected file to a ToolZippy image-processing server.

The maximum accepted file size is 20 MB. Images with extremely large pixel dimensions may exceed browser memory or Canvas limits even if the file is smaller than 20 MB.

Color profiles, orientation metadata and format support may vary by browser. Keep a copy of your original image before editing. For information about website-wide data handling, read our Privacy Policy.

Related Image Tools

Image Resizer ↗ Image Compressor ↗ Image Cropper ↗ Browse All Image Tools ↗

Frequently Asked Questions

Is this image border tool free?

Yes. You can add borders and download the resulting image without creating an account.

Can I add a border without changing image dimensions?

Yes. Select Inside as the border placement. The border will cover the image’s outer edge rather than expanding the canvas.

Can I use a transparent PNG?

Yes. PNG and supported WebP exports can retain transparency in the original image area. JPG output uses a white background.

Why does an outside border increase image size?

The selected border thickness is added to both sides. A 30-pixel border increases the width and height by 60 pixels each.

Are images uploaded for processing?

No. The border operation runs in your browser. The processing code does not upload your image to a remote image-processing service.

Why might a large image fail?

Browsers impose memory and maximum Canvas dimension limits. Reduce the original image dimensions and try again.

Scroll to Top