PerfectPixel by WellDoneCode (pixel perfect) by WELLDONECODE

PerfectPixel adds a semi-transparent image overlay on top of any web page, letting you compare your frontend implementation against the original design mockup directly in the browser. Upload a design comp, adjust opacity, and immediately see where your code diverges from the spec — with pixel-perfect accuracy. No more switching between tabs or squinting at two screens side by side.

How it works: install the extension, open any page, and drop in an image - drag and drop, paste a URL, or use the file picker. Position and scale the overlay, then adjust opacity to compare.

Features:

• Overlay any PNG, JPG, or SVG on any web page
• Adjustable opacity for real-time visual comparison
• 4 blend modes (Difference, Invert, Multiply, Overlay) plus Normal — each useful for catching different types of mismatches
• Lock the overlay to click through it and interact with page elements underneath
• Per-domain persistence: your layers stay saved per site and restore automatically across browser sessions
• Multiple layers per domain
• Scaling, repositioning, and centering controls
• Keyboard shortcuts for common actions

Pro features:

• Unlimited simultaneous layers (free tier supports 2)
• Folders to group layers
• Layer rotation
• Dark theme
• Custom icon, accent color, and custom CSS

Built for frontend developers, QA engineers, agencies, and development teams who need to verify that what they shipped matches what was designed.

Official Firefox version of Chrome Web Store extension with 350,000+ users.