Pixel QA by Flow Ninja

Overlay a Figma frame on the live page to check the build against the design, then run technical SEO checks on the same page.

Pixel QA puts the design and the build side by side without leaving the page, then checks that same page for the technical problems that quietly break a launch. Built by Flow Ninja for teams that ship fast and no longer have a QA department. DESIGN OVERLAY Paste a Figma frame link or drop an image, and the design is laid over the live page at its real width. Slide the opacity for an onion-skin pass, or switch to Diff — difference blending turns everything that matches to black and lights up everything that does not, which catches the 1px spacing and font-weight errors a 50% overlay hides. Blink flicks the design on and off twice a second; your eye reads a 2px shift as movement long before it reads it as a blur. • Nudge the alignment with Alt and the arrow keys, or drag it into place • Split the design into sections when one mid-page block is taller in the build, so everything below it can be pushed into line independently • A design per breakpoint — Desktop, Tablet, Mob L, Mobile — swapping automatically as you resize, with Webflow's defaults out of the box • Capture copies a screenshot with the overlay composited in and the panel out of frame, plus a written report of the URL, breakpoint, viewport and exact offsets, ready to paste into a ticket • Figma exports are cached, and the extension quietly re-checks whether the file has been edited since — so you are never QA-ing against last week's design without knowing TECHNICAL SEO A second tab checks the page you are on, with no design loaded and no setup: • Indexability — a noindex left over from staging, in the meta tag or the X-Robots-Tag header; whether robots.txt blocks the URL; the canonical; http vs https; whether the page is in the sitemap • Meta and social — title and description presence, duplicates and length; html lang; viewport; charset; favicon; hreflang; the Open Graph tags, and whether the og:image actually loads at a usable size • Content structure — exactly one H1, no skipped heading levels, images missing alt text, links with no accessible name, insecure links on an https page • Structured data — whether each JSON-LD block parses, and which types it declares • Links — internal and external counts, plus an opt-in checker that fetches the same-origin links and reports 404s and redirects Findings that point at something on the page can be outlined in place, and the whole list copies out as markdown for a ticket. Staging domains such as .webflow.io are recognised, so the noindex Webflow puts there is reported as expected rather than as a fault. HONEST BY DESIGN Red means something that will affect indexing. Amber is worth a look but breaks nothing. A hollow dot means the check could not run — never that it failed. A tool that invents findings stops being read, so lengths and counts only ever warn.