How I built a Safari-style Browser Frame for Website Screenshots (Python + Pillow)

Ever taken a screenshot with Playwright or Selenium and felt like it looked a bit... empty? When you automate screenshots, the browser engine captures exactly what’s in the viewport. It’s perfect for data, but if you’re using those images for a portfolio, a landing page, or a marketing report, they often look "naked" without the browser UI around them. Recently, a customer of my Screenshot API asked for exactly this: "Can you make the screenshot look like it was actually taken in a browser?" Since Playwright doesn't have a draw_browser_border=True flag, I had to build it myself using Python and the Pillow library. Here’s how I did it. The Challenge: No Stretching Allowed You can't just use a static background image of a browser and "stretch" it to fit. If your screenshot is 4K, a static UI image will look pixelated. If the aspect ratio changes, the buttons will look squashed. The solution was to draw the browser UI programmatically so it stays pixel-perfect at any resolution. The Imple