Difframe

Overlay reference sites and Figma prototypes on your page as a live iframe — a pixel-perfect comparison tool.

Difframe overlays a reference website or Figma prototype on top of the page you're building — as a live iframe, not a screenshot — for pixel-perfect comparison. Because the overlay is a real page, it always reflects the latest version of your reference and scrolls like the real thing. Features: - Difference blend mode: matching areas turn black, so misalignments stand out instantly - Scroll sync between your page and the overlay - Explicit input-target switching: send clicks and scrolls to the page or the overlay - Presets saved per page or per host: URL, opacity, scale, size, position, blend mode - Tab scope: override the preset in a single tab, e.g. to compare desktop and mobile side by side - Image mode as a fallback for sites that refuse to be embedded (paste or drop an image) - Paste a Figma share link as is — it is converted to the embed URL automatically Difframe collects no data. To display the reference page in an iframe, it removes frame-blocking headers (X-Frame-Options / CSP) only in tabs where the overlay is enabled, via per-tab session rules that are deleted when the tab closes. Other tabs and normal browsing are unaffected.