Frame a screenshot in a browser mockup

A raw screenshot pasted into a slide looks unfinished. Wrap it in a clean browser-window frame with margin and it reads as a product shot.

Tools used in this guide

The job

Documentation, README files, and portfolio pieces look more finished when the screenshot sits inside a recognizable window — a title bar with traffic-light buttons and an address pill — plus a bit of breathing room around it.

How to do it

Choose the screenshot, pick a light or dark frame, and download the PNG. The mockup adds a generic browser chrome bar above your image and a consistent margin around it.

  • Light and dark themes both use neutral colors so the screenshot stays the focus.
  • The chrome is generic — it does not imitate any specific browser brand.

Worked example

A 1440×900 app screenshot framed in the dark theme produces a PNG slightly larger than the source — chrome bar on top, even margin on all sides — that drops straight into a slide deck.

Limits

Static JPG, PNG, or WebP up to 25 MiB. The frame is drawn, not photographed — no device bezels, no perspective, no shadow presets beyond a subtle edge. Output is always PNG.