Screenshot Beautifier & Browser Mockup
Turn a plain screenshot into a polished image for posts, docs and launches — no watermark.
Preview
About the Screenshot Beautifier & Browser Mockup
Make a plain screenshot look finished in a few seconds. Paste it or drop it in, and it is placed on a background — one of the gradients, a soft mesh, a solid colour, your own photo (blurred and darkened if you like) or nothing at all — with padding, rounded corners and a shadow. Wrap it in a browser frame (light or dark, with the address you type) or a simple window frame with a title, and give it a slight 3D tilt or rotation.
Download the result as PNG, JPG or WebP at the screenshot’s own size or doubled for sharp Retina screens, or at a ready-made size for X, LinkedIn, Open Graph link previews, Product Hunt, Instagram or YouTube — the screenshot is fitted inside with your padding. Copy it straight to the clipboard to paste into a post or a document. There is no watermark, and the screenshot never leaves your device.
How to use it
- Take a screenshot and press Ctrl+V (⌘V on a Mac) on this page, or drop or choose the image file.
- Pick a Background: a gradient (and its direction), a mesh (press Shuffle for another arrangement), a colour, a photo, or None for a transparent background.
- Choose a Window frame and type the address or title to show in it.
- Set the Padding, Rounded corners and Shadow, and a Tilt preset or your own turn, lean and rotation.
- Under Size and file, keep Fit the screenshot (2× is sharpest) or pick a social size, choose PNG, JPG or WebP, then Download or Copy image.
Examples
Screenshot 2,880 × 1,800 · Browser, light, “example.com” · Gradient Dusk · Padding 8 % · Corners 12 px · Shadow Medium · Fit the screenshot, 2×
A 6,373 × 4,443 px PNG: the screenshot under a light address bar, on a purple-to-pink gradient.
The bar is 4 % of the screenshot’s width (115 px), and the padding a share of the framed screenshot’s shorter side (8 % of 1,915 px ≈ 153 px on each side), so both look the same for small and large screenshots; 2× doubles everything.
Size: Product Hunt gallery — 1,270 × 760 · Mesh Candy · Padding 10 %
Exactly 1,270 × 760 px with the screenshot fitted in the middle, 76 px from the nearest edges.
Window, dark, title “Terminal” · Background None · Padding 0 · Shadow None · PNG
Only the window: the screenshot under a dark title bar with rounded corners, on transparency — it fits light and dark pages.
Common uses
- Launch posts and gallery images for Product Hunt, X, LinkedIn and Mastodon.
- Open Graph images for blog posts and release notes.
- Documentation, slides, help articles and portfolio pieces.
- App and website screenshots for landing pages and pitch decks.
- Bug reports and design reviews that look tidy.
Sizes for each site
- X post, 16:9 (1,600 × 900): X shows a single photo between 2:1 and 3:4 without cropping (X Help Center); 16:9 is inside that range.
- LinkedIn post, 1,200 × 627: LinkedIn’s size for the image of a post with a link (LinkedIn Help).
- Open Graph / Facebook link, 1,200 × 630 (Meta for Developers).
- Product Hunt gallery, 1,270 × 760: the size Product Hunt recommends for gallery images (Product Hunt Help Center).
- Instagram, 1,080 × 1,080 and 1,080 × 1,350: Instagram keeps photos up to 1,080 px wide and shows shapes from 1.91:1 to 3:4 uncropped (Instagram Help Centre).
- YouTube thumbnail, 3,840 × 2,160 (16:9) (YouTube Help).
Sites change these sizes from time to time; the Social Media Image Size Guide lists more placements, each with its source.
Tips for good-looking screenshots
- Capture at your screen’s full resolution (on a Mac, a Retina screenshot is already 2×) and export at 2× — enlarged screenshots look soft.
- Crop to what matters before you start: a tight crop reads better in a feed than a whole desktop.
- Pick a background that contrasts with the screenshot: a dark app on a light gradient, a light page on a deep one. Add the thin outline when the screenshot’s edge disappears into the background.
- Keep tilts small (15–20°): they add depth, while large ones make text hard to read.
- Screenshots often show names, emails or account numbers. Hide them first with Blur Image before you share.
Limitations
- The frames are generic drawings of a browser and a window, not a particular browser’s or operating system’s exact look.
- The tilt is a flat image seen in perspective (no lighting or reflections).
- Pictures can be at most 8,192 pixels on a side and about 40 megapixels — use 1× for very large screenshots.
- Safari cannot make WebP files itself, so there the page uses its own WebP encoder, which takes a moment longer.
- The address bar uses your device’s own font, so it can look slightly different on another device.
Privacy
Everything happens in your browser. What you enter or open here is not uploaded or stored by MySmartCoPilot.
Frequently asked questions
Is my screenshot uploaded?
No. The screenshot and the background photo are opened and drawn by your browser on your device, and the download is made there too. Only your style choices are remembered in this browser.
Is there a watermark?
No. The image is yours: nothing is added, and there is no account or limit.
How do I get a transparent background?
Choose None as the background and download a PNG or WebP. Set the padding to 0 and the shadow to None to get only the framed screenshot; with padding and a shadow, the shadow stays semi-transparent around it.
Why does my screenshot look blurry?
It is being enlarged to fill a bigger size — the page warns you when it is more than 1.5×. Use a larger capture, a smaller output size, or more padding.
Can I paste a screenshot directly?
Yes. Take the screenshot to the clipboard (Windows: Win+Shift+S; Mac: Ctrl+Shift+⌘+4) and press Ctrl+V or ⌘V on this page. Pasting again — or dropping another screenshot on the preview — replaces it and keeps your style.
How do I put a screenshot into a phone or laptop frame?
Use the Device Mockup Generator: it places screenshots into generic phone, tablet, laptop, monitor and watch frames.