Overview
Introduction
This tool rounds a JPG's four corners entirely in your browser, filling the rounded-off regions with a solid matte color of your choosing.
Because JPEG can't represent transparency, the copy here is upfront that this is a matte fill, not a genuine cutout: for real transparent rounded corners, the PNG category has an equivalent tool.
What Is JPG Corner Rounder?
A client-side JPG corner-rounding tool that computes a rounded-rectangle mask (identical geometry to a CSS `border-radius` clip) and marks every pixel outside that mask as exposed.
Those exposed corner pixels are then flattened onto a matte color you pick before the result is painted to the preview canvas and offered for download.
How JPG Corner Rounder Works
The tool computes a pixel radius from your chosen percentage and the image's smaller dimension, then for each of the four corner squares checks whether a pixel falls within the rounded quarter-circle mask or outside it (marked as exposed).
Exposed pixels are left at zero alpha in the working buffer; the shared preview panel then flattens the whole image onto your chosen matte color, so the rounded corners render as a clean solid fill rather than the browser-default black a naive canvas export would produce.
When To Use JPG Corner Rounder
Use it to give a photo or graphic a softer, rounded-corner look for a card-style layout, matching the matte color to your page or card background for a seamless blend.
It's a good final styling step after cropping or resizing a JPG to its target dimensions.
Often used alongside PNG Corner Rounder, JPG Border Adder and JPG Cropper.
Features
Advantages
- Runs entirely client-side; the uploaded photo is never sent to a server.
- Matte color is fully customizable to match any background.
- Radius is expressed as a percentage, so it scales sensibly across differently-sized images.
Limitations
- Corners can never be genuinely transparent in a JPEG output; they can only be filled with a solid matte color.
- Only a uniform radius across all four corners is supported in one pass.
Examples
Best Practices & Notes
Best Practices
- Match the matte color to the exact background color the image will sit on, so the fill is invisible rather than a visible box behind rounded corners.
- For genuine transparency instead of a matte fill, use the PNG category's corner rounder tool.
Developer Notes
roundJpgCorners mirrors the equivalent PNG-category corner rounder's rounded-rectangle mask math exactly (same radius-from-percentage and per-corner distance-check logic), just against the jpg PixelBuffer/JpgToolResult types; it deliberately leaves masked pixels at alpha 0 and lets the component pass a user-chosen matte color through to JpgPreviewPanel's matte prop rather than hardcoding white.
JPG Corner Rounder Use Cases
- Softening a photo's corners for a card-style layout
- Matching a rounded image seamlessly to a page or card background color
- Styling a thumbnail or avatar image with a friendlier rounded look
Common Mistakes
- Expecting truly transparent corners from a JPEG output: only the PNG version of this tool can do that.
- Leaving the matte color at the default white when placing the image on a non-white background, producing a visible white box around the rounded corners.
Tips
- Sample your page's exact background color (a hex color picker on your OS or browser dev tools can help) for a seamless matte match.
- Combine with the border adder tool afterward for a rounded-corner image with a matching-color frame.