Image Border & Frame Generator

A band of white around a photograph is an old print habit that survived the move online, because the frame stops an image bleeding into whatever sits behind it. Image Border & Frame Generator paints that band onto the canvas itself, so the border travels inside the file rather than living in a stylesheet the next platform will throw away. Five styles are available: a solid band, a double rule, one inset hairline, the deep-lipped Polaroid, and a float where the photo casts a shadow onto its own mount.

Nothing has to be uploaded before the tool does something. A 720 × 480 sample landscape is painted onto the canvas as the page opens, already wearing the same settings as the Classic white preset, so every slider has a visible effect from the first second. Your own JPEG, PNG or WebP replaces it whenever you drop one on. Files up to 12 MB are read, and the decoding happens on your machine.

Width is the setting worth understanding. Measured as a percentage it tracks the shortest edge of the photo, which means 4% produces a visually identical frame on a 600 px thumbnail and a 6000 px original. Switch the unit chip to px and the number becomes an absolute measurement at native resolution instead. The switch converts the current value rather than resetting it, so the frame you are looking at does not jump when you change how it is measured.

Getting a Frame Onto Your Own Photo

1. Leave the sample landscape in place while you experiment, or drop a file on the upload strip at the top. The strip stays visible after loading, so swapping photos never means resetting your frame.
2. Choose a Frame style. Solid, Double and Inset keep all four sides even; Polaroid makes the bottom lip 2.6× the side width; Float draws the photo above the mount with a soft shadow beneath it.
3. Set Border width and, if you want soft corners, Corner radius. Radius runs 0 to 50%, where 50% rounds each end into a half-circle.
4. Pick the Frame colour from the swatch or type a hex value into the field beside it. Rule colour only affects the Double and Inset styles and greys itself out for the other three.
5. Press Download. The file is rendered from the original pixels, so a 4000 × 3000 photo with a 4% band exports at 4240 × 3240 rather than at the size of the preview on screen.

Size, Weight and the 16-Megapixel Ceiling

• The on-screen preview is capped at 880 px on its longest edge. That cap is what keeps slider drags smooth on a 24-megapixel photo; the export ignores it completely.
• Est. weight is a real measurement, not a guess. Roughly 450 ms after you stop adjusting, the full-resolution export is encoded in the background and its byte count is reported.
• Above 16 megapixels of output that probe is skipped and the readout says over 16 MP. Encoding a frame that large on every settle costs more than the number is worth. Download still works normally.
• Pad to a square grows the shorter side until the canvas is 1:1, splitting the extra between the two opposite borders. A 1600 × 1200 photo at 4% lands on 1696 × 1696, with 248 px of frame above and below against 48 px at the sides.

Format Notes: Alpha, Corners and Hex Input

PNG and WebP carry an alpha channel, so a rounded corner exports as genuine transparency. JPEG has no alpha, and rather than let those corners come out black the canvas is flooded with white before the frame is drawn. If you are rounding corners for a dark page, export PNG. The format chips also set themselves from whatever you upload, which saves a PNG logo from being silently re-encoded as a lossy JPEG.

Hex fields accept three or six digits, with or without the leading hash, so fff, #fff and #FFFFFF all resolve to the same white. Anything else leaves the current colour untouched and reports Enter a 3- or 6-digit hex colour, like #FF7A59. An unsupported upload is refused with That file type isn't supported — choose a JPEG, PNG or WebP.

One panel is easy to scroll past. Below the preview, Same frame in CSS emits the rule that reproduces the current frame on a web page, with pixel values quoted at the photo's native size rather than the preview's. Copy it when you want the border applied by a browser instead of baked into the image, and keep the download for anywhere that only accepts a flat file.