Item logo image for AsDesigned Companion

AsDesigned Companion

5.0(

3 ratings

)
Item media 1 (screenshot) for AsDesigned Companion

Overview

Compare Figma designs with their live web implementation using a pixel-perfect overlay.

Ship exactly what was designed. AsDesigned is an overlay and visual QA plugin for Figma. It turns any selected frame into a secure comparison web app that you can open with the AsDesigned Companion Chrome extension. The Figma design is overlaid directly on top of the live website in a browser viewport that exactly matches the selected frame. Adjust the overlay opacity to spot visual differences, move and align the design, inspect layers and spacing, or interact with the website underneath. Pan and zoom just like in Figma, use familiar keyboard shortcuts, and reopen your three most recent comparisons for up to 24 hours. Some websites block iframe embedding. AsDesigned works best with local, development, staging, or production environments that allow their pages to be displayed inside an iframe. Requires the free AsDesigned Figma plugin.

Details

  • Version
    1.0.2
  • Updated
    August 16, 2026
  • Size
    439KiB
  • Languages
    2 languages
  • Developer
    Email
    louis@menochet.fr
  • Non-trader
    This developer has not identified itself as a trader. For consumers in the European Union, please note that consumer rights do not apply to contracts between you and this developer.

Privacy

Manage extensions and learn how they're being used in your organization
The developer has disclosed that it will not collect or use your data. To learn more, see the developer’s privacy policy.

This developer declares that your data is

  • Not being sold to third parties, outside of the approved use cases
  • Not being used or transferred for purposes that are unrelated to the item's core functionality
  • Not being used or transferred to determine creditworthiness or for lending purposes

Related

OverlayQA – Design QA & Website Feedback

5.0

Design QA + website feedback tool. Detect UI bugs, run WCAG audits, compare Figma. Export to trackers

Web to Figma

2.1

Web to Figma extension to capture pages and components and import them into Figma as editable designs. No more screenshots.

HTML to Figma (by Yashi Tech Solutions)

2.6

Convert webpages into a Figma design

Over.fig – Compare design to website in real time

4.6

Bridge the gap between design and code. Convert your Figma into a pixel-perfect semi-transparent overlay directly on your web page.

html.to.design

4.6

Convert any website into fully editable Figma designs. Requires the associated Figma plugin!

Web to Figma Capture

4.2

Capture any website and export it to Figma with pixel-perfect accuracy. Preserves layout, typography, and assets.

Claude Design Importer

5.0

Captures Claude Design decks from your browser to import as native, editable layers in Figma.

Copy to Design - Web to Design

5.0

Capture webpage elements and copy them to design tools, including Figma, MasterGo, and Axure.

Figma 中文助手

0.0

轻量汉化网页版 Figma 的界面文案,不处理画布内容。

Copy web to Figma - 复制为可编辑设计稿,无需安装Figma插件

5.0

一键复制网页转换为可编辑的 Figma 设计稿,支持任何网站,无需Figma插件,免费使用

html2design

5.0

웹페이지 전체 또는 선택한 영역을 캡처해 편집 가능한 Figma 디자인으로 변환합니다.

Difframe

0.0

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

OverlayQA – Design QA & Website Feedback

5.0

Design QA + website feedback tool. Detect UI bugs, run WCAG audits, compare Figma. Export to trackers

Web to Figma

2.1

Web to Figma extension to capture pages and components and import them into Figma as editable designs. No more screenshots.

HTML to Figma (by Yashi Tech Solutions)

2.6

Convert webpages into a Figma design

Over.fig – Compare design to website in real time

4.6

Bridge the gap between design and code. Convert your Figma into a pixel-perfect semi-transparent overlay directly on your web page.

html.to.design

4.6

Convert any website into fully editable Figma designs. Requires the associated Figma plugin!

Web to Figma Capture

4.2

Capture any website and export it to Figma with pixel-perfect accuracy. Preserves layout, typography, and assets.

Claude Design Importer

5.0

Captures Claude Design decks from your browser to import as native, editable layers in Figma.

Copy to Design - Web to Design

5.0

Capture webpage elements and copy them to design tools, including Figma, MasterGo, and Axure.

Google apps