Google Docs does not include a native control for adding a border around an inserted image, so the frame has to be part of the image file itself before you drop it into a document. Google Docs does support page borders and paragraph borders through its built-in menu, but those decorations wrap the page or the text and not a single picture, which means a cleaner approach is to render the border locally and then insert the finished file. The Add Border to Image tool does exactly that: it loads a local JPG, PNG, or WebP into your browser, expands the canvas evenly on all four sides, paints an opaque rectangle in your chosen color, draws the original photo once at an offset equal to the border width, and exports a PNG that downloads directly to your device. Every step happens inside the current browser tab, so your photo never reaches a server. The border is solid, rectangular, and even on every side, and it is drawn outside the original image rather than on top of it, which preserves every source pixel at its original coordinate scale.
Why Google Docs skips the image-border control
When you place a picture in Google Docs, the formatting toolbar exposes text wrap, position, size, recolor, and brightness controls, but it does not surface an outline or border style for the image itself. The native border commands in Docs are tied to the paragraph or the page, not to floating images, which is why readers searching for an image border in Docs often end up layering a manually drawn rectangle behind the photo or settling for a colored margin. Google Slides does offer an image-border color and weight, which is a recurring source of confusion when people move between the two apps, and the practical workaround inside Docs is to produce a PNG that already carries the frame and then insert that PNG as a single object.
This approach is also more portable. Because the border is baked into the pixel data, the image keeps its frame anywhere it is shared, pasted into a Gmail draft, exported to PDF, or downloaded by a collaborator. There is no risk of a collaborator seeing a borderless version because the rendering of styles depended on their browser or on whether the file was exported in a format that preserved the styling.
Preparing a bordered image locally
Open the Add Border to Image tool in a browser tab on the same computer that holds your source file. The whole workflow runs inside that tab, so no uploads, accounts, or extensions are required, and your picture never leaves the device. Follow the steps below to produce a frame-ready PNG for your document.
- Click the file picker and choose a local JPG, PNG, or WebP from your computer. Confirm that the filename and preview match the file you intended to frame.
- Enter a whole-number border width between 1 and 500 pixels. Start small for a subtle hairline frame or go larger for an editorial-style mat.
- Type or pick a solid six-digit hexadecimal color such as #1F4E79 or #FFFFFF for the frame. The chosen color is painted as an opaque rectangle.
- Select Add border. The tool expands the canvas, fills the new area with the chosen color, and draws the source once at the matching offset.
- Review the expanded output dimensions shown by the tool, and confirm the source size is unchanged inside the new canvas before downloading.
- Download the PNG to your device. The file is ready to insert directly into a Google Doc.
If you change the file, the width, or the color after the first export, the previous result is invalidated and its temporary download link is released, which keeps stale downloads from being mistaken for the current frame.
How the border width shapes the output
The canvas grows by twice the border width in each direction, because the same number of pixels is added to both sides of every edge. The implementation spells this out with a worked example: a 20-pixel border on a 500 × 300 source produces a 540 × 340 PNG, and the original photo is drawn at x=20 and y=20 inside that expanded rectangle. Every source pixel is preserved at its original coordinate scale, so the photo is not resampled, stretched, or cropped to make room for the frame.
Three interacting limits decide whether the export will succeed.
- Source file format and size: JPG, PNG, or WebP up to 25 MiB.
- Border range: whole-number pixels from 1 to 500.
- Final canvas: the resulting width × height must stay below the tool's 20-megapixel canvas cap, otherwise the export fails visibly rather than silently truncating.
| Setting | Limit or type |
|---|---|
| Accepted input formats | JPG, PNG, WebP |
| Maximum source file size | 25 MiB |
| Border width | 1 to 500 pixels, whole numbers only |
| Border color | Six-digit hexadecimal (for example #000000) |
| Output format | PNG, always |
| Output canvas cap | 20 megapixels after the border is added |
| Where the work runs | Current browser tab only |
The arithmetic follows the simple formula newWidth = sourceWidth + 2 × border, with the same expression applied to the height, so any whole-number border between 1 and 500 produces a predictable result before the canvas cap is checked. Requests that would push the result past 20 megapixels are rejected rather than silently resized, which is why especially large framed exports should be planned around that ceiling.
Inserting the bordered PNG into Google Docs
Open the Google Doc you want to edit and place the cursor where the framed photo should appear. From the menu choose Insert, then Image, then Upload from computer, and pick the PNG you just downloaded. The picture lands on the page as a single floating object, with the border already drawn around it. The canvas drawImage call used by the tool plants the source exactly once at the chosen offset, so the border pixels and the source pixels share the same coordinate system inside the PNG and resize together when you drag the corner handles in Docs.
Two practical adjustments tend to come up once the bordered image is on the page. First, set the text wrap to Wrap text or Break text so paragraphs flow around the framed photo, which is usually what makes the border look intentional rather than pasted on. Second, hold Shift while you drag a corner handle to keep the aspect ratio of the framed image, because the source photo and the border were captured at a fixed ratio when the PNG was produced and you want to preserve that frame.
What Add Border to Image doesn't do
This tool produces a rectangular solid frame only. It does not generate rounded corners, gradients, drop shadows, decorative patterns, captions, print bleed, or color profiles, and the geometry is locked at one equal width on every side, so per-side borders or asymmetric frames need a different editor. Existing transparent pixels in a PNG source remain transparent inside the image while the new border is opaque, which is helpful when the source has cut-out shapes because the frame is painted around the cut-out and not on top of it.
Because the output is always PNG, a JPEG source is decoded and then re-encoded, and the resulting file size can increase because the JPEG source is decoded and re-encoded. For color-managed printing, exact physical dimensions, batch processing, or any non-destructive layered work, this is not the right tool and a desktop image editor is the safer choice. If your goal is to add an image border that travels with the file into Google Docs and renders the same way for every reader, however, the PNG this tool produces has exactly what Docs needs.