Safari Mockup

Exclusive Freebie

Last Updated on August 27, 2026 by Editorial Team

  • Free Mac OS Safari browser mockup (1920 x 1400).
  • 100% Scalable PSD file with vector shapes and fully editable texts.
  • Includes HTTPS icon (lock).
  • Mockup by FreebiesCafe.
  • Created after Safari version 10.1.2

What makes this Safari mockup genuinely useful is the layering it shows in the preview. You get two browser windows stacked at slightly different angles, one showing an active page with a URL bar and lock icon, the other pulled forward with the Favorites grid visible.

That layered arrangement mirrors how people actually work in a browser, switching tabs, opening a new window, jumping between a live site and a bookmarks screen. It gives you two presentation surfaces in a single file instead of one flat window.

The chrome itself is rendered in the light, minimal style of Mac OS Safari from that era: traffic-light buttons in red, amber, and green, back and forward arrows, a sidebar toggle icon, and a centered address bar with the padlock and domain name. Everything is drawn cleanly with soft drop shadows separating the two windows from the gray background, which keeps the focus on whatever screen content you drop in.

This is a browser mockup built for showing off web design work, so the obvious use is dropping a full-page screenshot of a website, landing page, or web app into the address-bar window to see how it reads inside real browser chrome.

Because a second window is included, you can also show a homepage in one and an interior page, a dashboard, or a bookmarks view in the other, which is handy for portfolio pieces where you want to communicate more than one screen without stacking separate mockups yourself.

It also works well for:

  • Portfolio case studies where you want the site to look “in context” rather than as a bare screenshot
  • Client presentations, since the familiar Safari frame reads as trustworthy and finished
  • Blog posts and tutorials about web design, browser UI, or responsive layouts
  • Product pages for themes, templates, or website builders that need a realistic preview

Editing it is straightforward in any editor that opens layered files. Locate the smart object or content layer inside the address-bar window, paste in your webpage screenshot, and it should scale to fit the frame automatically if the layer is set up that way.

Do the same for the second window if you want to fill the Favorites area with your own bookmark tiles or a second page capture. Since the shapes are vector-based, you can resize the whole composition up for a hero banner or down for a smaller thumbnail without the browser chrome turning soft or pixelated.

The URL text and lock icon are also editable, so swap in your own domain name to make the presentation feel specific to the project rather than generic.

Styling Tips For The Two-Window Layout

Because the two windows overlap, think about which one carries the primary message. Put your best, most finished screen in the front window where it catches the eye first, and use the back window for supporting context, like a bookmarks bar or a secondary page.

If you only have one screen to show, it’s fine to hide or minimize the second window rather than filling it with filler content just to use the space.

For backgrounds, a plain or softly gradient backdrop keeps the shadows readable and lets the browser windows read as the clear subject, which matters most when this mockup sits inside a portfolio grid alongside other project thumbnails.

Pair it with a device mockup, like a laptop or monitor frame, if you want to ground the browser in a physical setting rather than floating on its own; just keep the screen content consistent across both so the presentation feels like one cohesive shot rather than two unrelated pieces.


IMPORTANT: This is an exclusive freebie. If you would like to share this freebie on your website, the download button on your website must point to this page and you must credit FreebiesCafe as author in your description. Redistributing the files or derivatives from them is not permitted. Thanks.

Check out all the Exclusive mockups & freebies →

Similar free resources