Staaarter

JPG Border Adder

Uploads a JPG and surrounds it with a solid-color border of a chosen pixel thickness, expanding the canvas to fit the border while keeping the original photo intact and centered, then downloads the framed JPG. Since JPG has no transparency, the border is always a fully opaque matte color. A free online tool from Staaarter, right in your browser.

Runs locallyUpdated 2026-07-29
By Staaarter Team
editorborderimagecanvasjpg

Overview

Introduction

This tool adds a solid-color border around a JPG photo, entirely client-side, without cropping or scaling the original content.

The canvas grows to accommodate the border, so every original pixel is preserved exactly as uploaded.

What Is JPG Border Adder?

A client-side JPG border/frame generator that reads an uploaded photo's pixel data, builds a new, larger canvas filled with a chosen solid RGB color, and pastes the original image centered within it.

Since JPG has no alpha channel, the border color is always fully opaque; there's no transparency option here, unlike the PNG equivalent of this tool.

How JPG Border Adder Works

The tool first computes the new canvas size (original width/height plus twice the border thickness), fills every pixel of that canvas with the chosen border color, then copies the original image's pixels into the center at an offset equal to the border thickness.

Because the fill happens before the copy, the original photo always ends up perfectly centered and untouched.

When To Use JPG Border Adder

Use it to frame a photo for a polished, finished look, add a brand-color border before posting a product image, or create a consistent visual frame across a set of photos.

It's also a simple way to visually separate a photo from a page background it might otherwise blend into.

Features

Advantages

  • Runs entirely client-side; the uploaded photo is never sent to a server.
  • Never crops or scales the original image content.
  • Simple, predictable uniform-thickness framing.

Limitations

  • Only a uniform thickness on all four sides is supported in one pass; use JPG Margin Adder for per-side amounts.
  • Very thick borders on an already-large photo can push the output past the site's 4096px maximum dimension, which the tool will reject with an explanation.

Examples

Add a white frame to a photo

Input

An 800x600 JPG, thickness 20, white

Output

An 840x640 JPG with a 20px white border and the original photo centered

The classic 'polaroid'-style framed look.

Add a black border for a gallery post

Input

A 1080x1080 JPG, thickness 15, black

Output

A 1110x1110 JPG with a clean black frame

A common styling choice for square social media posts.

Best Practices & Notes

Best Practices

  • Use a border color that complements your photo's dominant colors for the most polished look.
  • Keep border thickness proportional to the image size; a very thin border on a large photo can look accidental rather than intentional.

Developer Notes

addJpgBorder is a pure lib function operating on a plain Uint8ClampedArray PixelBuffer: it allocates a larger buffer, fills it uniformly with the requested opaque RGB color, then copies the source buffer's pixels into a centered offset. jpg-padding-adder and jpg-empty-space-wrapper both thinly wrap this same function with different default colors and framing.

JPG Border Adder Use Cases

  • Framing a photo for a polished, print-ready look
  • Adding a brand-color border before posting a product image
  • Creating a consistent visual frame across a photo set

Common Mistakes

  • Expecting an asymmetric border in one pass: this tool applies the same thickness to every side; use JPG Margin Adder for that.
  • Requesting a very thick border on a near-4096px image and hitting the maximum-dimension error.

Tips

  • Use JPG Border Remover afterward if you need to trim the border back down or undo a mistake.
  • For a lighter 'breathing room' effect instead of a visible frame color, try JPG Empty Space Wrapper's white default.

References

Frequently Asked Questions