It captures the page at the exact size of the frame and tells you what changed: spacing, type, color, sizes, borders and shadows.
Figma against the page · Drag the divider
A landing page built to match its Figma file, and a copy with 13 mistakes planted on purpose. It only counts if it shows as visible, on the right element, with both values correct.
Measured with a ±1 px margin and colors equal up to delta E 2.3.
Four steps and done, without measuring anything by hand.
Step 1
Right-click in Figma › Copy link to selection. If the frame has tablet and mobile versions, it finds them.
Found all 3 versions of the frame
Step 2
Localhost, staging or production. If it asks for a password, you sign in inside the app.
Session saved for this site
Step 3
It captures and measures each size. A page 8,294 px tall takes about 12 seconds.
Step 4
Pick what matters and create the Jira ticket with the crops, or copy the text for Slack.
What shows comes first
Visible at a glance, minor, or structure only. It also tells you whether it comes from the component library or from this screen, so you know where to fix it.
21 differences
Check the ones that go in the ticket. If you check none, the ticket takes the visible ones.
Visible 18
The exact value
Open a difference to see what Figma expected, with its token, and what the page has today. One note groups every element with the same mistake.
Border color
The border color is darker than in Figma: #ebebeb in Figma and #d1d1d1 on the page. Noticeable side by side.
Your tolerances
A pixel tolerance for spacing and sizes, and two delta E thresholds for color: up to where it is the same and from where it shows.
One app for macOS, Windows and Linux. It installs like any other, updates itself and goes back to the previous version if something fails.
Version 1.1.0 · By downloading you accept the license agreement.
Features
What version 1.1.0 does today, no fine print.