Convert any Webpage into fully editable figma design. Requires the figma plugin with the same name.

Latest Version

Version
1.0.1
Update
August 23, 2024
Size
99.73KiB
Developer
www.livepolls.app/chrome_addons
Category
Users
462
Rating
5 ★
Manifest Version
3
Web Store Status
Languages Support
English
See more
Permissions
Tabs
ActiveTab
See more

HTML to Figma — Import Webpages to Figma Extension

Import websites into Figma to iterate, redesign, benchmark and more, without building each element from scratch.

2000+ components
Pixel-perfect capture
Light and Dark themes
multiple viewport sizes

This Chrome extension is a companion to the figma plugin with the same name, and you’ll need to install the Figma plugin first.

Install the Webpages to Figma Chrome Extension from Chrome Web Store
Go to any website in your Chrome Browser
Invoke the extension, and then choose if you want to capture the entire page or a single component
Once the extension captures the page, save and download the page/component data
Go to Figma and run the plugin
Upload the data you just downloaded
The plugin automatically converts the data into a figma design.
Read more

Source Manifest.json

{"update_url": "https://clients2.google.com/service/update2/crx", "manifest_version": 3, "name": "HTML to Figma \u2014 Import Webpages to Figma", "description": "Convert any Webpage into fully editable figma design. Requires the figma plugin with the same name.", "version": "1.0.1", "permissions": [ "tabs", "activeTab" ], "action": { "default_popup": "src/popup/index.html" }, "icons": { "16": "img/16.png", "48": "img/48.png", "128": "img/128.png" }, "content_scripts": [ { "js": [ "assets/index.ts-loader-DT4KzRj3.js" ], "matches": [ "" ], "css": [ "assets/index-cZyaGdXu.css" ] } ], "web_accessible_resources": [ { "matches": [ "" ], "resources": [ "assets/useChromeMessage-DboUbIU0.js", "assets/index.ts-LmQBJpxF.js" ], "use_dynamic_url": true } ]}
Read more

Similar Extensions

icon

Enable UI3 Beta for Figma Extension · Developer Tools 462 36 ★ 108KiB

icon

Figma Extension · Productivity 462 27 ★ 1.36MiB

icon

Markflow: Copy Elements to Figma, React, etc. Extension · Developer Tools 462 4 ★ 1.6MiB

icon

Designer Daily Report Extension · News & Weather 462 383 ★ 65.9KiB

icon

HTML to Figma - by Builder.io Extension · Productivity 462 46 ★ 343KiB

icon

Page to design Extension · Productivity 462 0 ★ 134KiB

icon

HTML to Framer Extension · Productivity 462 38 ★ 35.35KiB

icon

Codia AI Web2Figma: Import Web to Editable Figma Extension · Developer Tools 462 0 ★ 657KiB

icon

HTML to React & Figma by Magic Patterns Extension · Developer Tools 462 10 ★ 392KiB

icon

Web to Figma Extension · Productivity 462 12 ★ 945KiB

icon

Drafito Extension · Productivity 462 0 ★ 584KiB

icon

Element to Figma Extension · Productivity 462 1 ★ 197KiB

icon

html.to.design Extension · Productivity 462 72 ★ 333KiB

icon

HTML to Figma - by DemoWay (Pixel-Perfect Web to Figma Design) Extension · Productivity 462 9 ★ 9.59MiB

icon

PageRip (HTML + CSS Extract) Extension · Developer Tools 462 54 ★ 434KiB

icon

Panda Helper Extension · Productivity 462 3 ★ 14.44KiB

icon

Hover inspector like in Zeplin , Figma Extension · Developer Tools 462 29 ★ 122KiB

icon

SVG Gobbler Extension · Developer Tools 462 95 ★ 1.18MiB

icon

Site Palette Extension · Developer Tools 462 344 ★ 297KiB

icon

Pixelay for Figma Extension · Developer Tools 462 4 ★ 391KiB

icon

Hoverify Extension · Developer Tools 462 145 ★ 14.54MiB

icon

benchmark.design Extension · Productivity 462 9 ★ 48.6KiB

icon

copy-figma-css Extension · Developer Tools 462 3 ★ 153KiB

icon

SaveToFigma Clipper Extension · Productivity 462 3 ★ 333KiB