Pixfit

Pixfit overlays your design comp directly on the page you're building, so you can spot every pixel gap — heading positions, spacing, button widths — at a glance. ■ Who it's for • Frontend developers checking their build against the design • Designers and directors reviewing implementation • Anyone doing responsive QA across PC and SP layouts ■ Features • Auto-fit to the viewport An 1800px comp on a 1440px screen is shown at 80%, automatically. No scale math. • PC / SP auto switching Register up to two comps each for PC and SP. Pixfit shows the right one based on your breakpoint. • Fit to Element (Parts) Pick a section or card on the page and Pixfit fits a partial comp to its width. • LOCK mode for DevTools The overlay becomes click-through, so page interaction, right-click and the Element Picker keep working. • Precise positioning Drag, use arrow keys (1px, or 10px with Shift), or type X / Y values. • Opacity control and quick show / hide • Scale: Auto / Original / Custom (10–300%) • Settings are saved per page automatically ■ How to use 1. Click the Pixfit icon on the page you want to check 2. Choose a comp image (PNG / JPG / WebP) or drag & drop it onto the page 3. Lower the opacity and spot the differences ■ Local files To use Pixfit on file:// pages, turn on "Allow access to file URLs" in the extension's details. http://, https:// and localhost work with no extra setup. ■ Privacy Your images and settings are stored only in your browser (chrome.storage.local). Nothing is ever sent to an external server.