Created by Amsterdam-based Twelve TwentyUberlayer lets you display any image as an overlay on your Mac and lock it in place. This deceptively simple utility can be used for a variety of purposes, like watermarking a presentation, but for Web designers, it makes it so easy to compare design mockups with final products.

When creating a site, it’s common to start off in Photoshop with a mockup and then code the working results match your desired design. Traditionally, this involves trial and error, making sure every single pixel matches up — something especially difficult to do with Web typography.

Normally that matching process involves taking screenshots of your work and overlaying things in Photoshop, checking back and forth. Uberlayer eliminates that back and forth, so you can actively adjust elements and compare them at the same time. That’s it.

If you’re an efficient-minded designer or developer, you know what to do. The app just received a Retina update and costs two bucks.

➤ Uberlayer, $2 via the Mac App Store

Screen Shot 2012 09 10 at 5.45.43 PM 520x333 Uberlayer lets you overlay design mockups and reference them as you code

Featured image Brendan DeBrincat