html.to.design
Extension Actions
- Extension status: Featured
- Extension status: In-App Purchases
Convert any website into fully editable Figma designs. Requires the associated Figma plugin!
Import any website into Figma as fully editable designs!
With html.to.design, convert any website into fully editable Figma layers. Leverage an existing website and import its HTML to Figma to start your own designs, without building each element from scratch.
This Chrome extension is a companion to the html.to.design Figma plugin, which you’ll need to install for certain features. If you are using the “Copy to clipboard” option, you do not need to run the Figma plugin — simply paste (⌘+V) your captured webpage in your canvas!
This extension also has built-in support for AI Tools like ChatGPT, Bolt and Lovable, and can directly capture their results without any extra steps. You can find the full list of AI tools supported here: https://html.to.design/docs/import-from-ai-tools
How it works:
===========
1. Install the html.to.design Chrome extension by clicking on [Add to Chrome] on this page.
2. Navigate to the page you would like to import into Figma.
3. Click on the html.to.design extension icon in your Chrome top bar.
4. Hit 'Capture' and the extension will automatically start capturing the page.
Once your webpage has been captured, there are several ways to import it into Figma:
a) Store it locally as an .h2d file that must be dropped into the html.to.design Figma plugin
b) Send it directly to the Figma plugin
c) Download it as a .make file to be used in Figma Make
d) Copy it to the clipboard to then directly paste the result in Figma
---
Notes:
In order to best map what you see in your browser to Figma, we need to access Chrome's debugging features.
Latest reviews
- Laszlo Zagyva
- Best extension for this type of task.
- nino kurtanidze
- Hello, Why am I not able to switch the website to mobile screen sizes?
- Luca Carrozzo
- Amazing extension for frontend devs
- Erik Hansen
- I've been using this for a year. Makes my design workflow massively faster for design updates to existing sites. They have a generous free tier, but I use it so much that I pay for their Pro version.
- Brandon Mitchell
- This extension is a must have for Frontend Devs and designers! I use it all the time in my workflow to mock up websites in Figma. Don't know where I'd be without it
- Reed Graff
- Super solid. Extremely useful. The workarounds to do this are really painful.
- Dj Shiflet
- Love this extension so much, wish there was more monthly free imports but nonetheless its an incredible tool. works just about everytime with auto layout and color matching!
- HelpDonate
- Works right out the box
- Huy Quang
- Very well i like it more than web to figma extention
- Esther Navarro
- THANK YOU SO MUCH
- Christina Tzani
- Amazing tool & very nice of them to give you 10 captures each month!
- Muntadher Al-Shammari
- This is so incredible and very efficient! Thanks a lot.
- VOTY
- AMAZING omg looking for you for so longgg 😭
- Htet Htet Aung
- It's so amazing!!!!!!
- Frank Thiele
- Super helpful tool! Merci!!
- Domênica Iglesias de Lima Sgarzi
- LOVE IT!
- Serhii Mudrak
- top app!
- Obiajulu Anthony
- This is so nice , absolutely amazing! You guys just bagged another customer
- nigel mashayamombe
- Thanks for making this .... i love it
- Mikhail Nikishin
- Great expansion! In a couple of clicks, you get a ready-made design with blocks in Figma. It's just amazing.
- Remy Jouni
- Rarely something impresses me, but this plugin is flawless, way more than what I expected, I managed to import back my website to Figma and it mapped the colors correctly to local styles! It also supports Arabic even though it didn't mention it.
- Svetoslav Stefanov
- Used it once 2 years ago - great work. Now it doesn't work with latest Chrome :( . And this time I needed for real. it doesn't auto import a page, nor manually exporting to h2d and then importing back to Figma works anymore. EDIT: it worked perfectly well in Chrome + windows PC
- Mr.potato yt
- Extenstion dosent work anymore. When figma is opened it dosent let you dragndrop just copy the figma's webpage
- Ilyas Momynov
- you guys are saving lives here
- kayla wu
- Very useful tool
- Yoga Pratama H
- awesome tools
- Hector-Rafael Aponte
- Will se how it goes :), sounds fun!! keep in mind...anyone, make sure be creative enough so you wont enter into copyrights issues with any brand.
- Juan Camilo Cardona
- Awesome!!
- Nishant Hinge
- Loved it
- Hugo Knapp
- Elite
- Renga Club
- Goat plugin
- Sohail Ahmed
- Best Extension...
- Dheeraj Singh Nagdali
- Not bad.
- Nhlangano Chabalala
- The absolute best Figma plugin.
- fengcheng cui
- so good
- Ramon Vorich
- Wow!
- Angy Brooks
- Fantastic Figma Plugin / Google Extension! If you're a Figma user, this is a must have, secret weapon plugin/extension. This has saved me hundreds of hours of time when needed to re-create an existing web/app page. When I came across a small problem, support was responsive and it was fixed within the week. (P.S. I have the paid version and it's worth every penny.)
- Arthur Shwab
- Well executed plugin, and when I hit an edge case, their customer support on Discord was super helpful and responsive. Thanks Greg!
- L007
- life saver!
- Leonardo Gomes da Silva
- Show!
- abdul's ideas
- plz guide me i ant to check the pricing of the ( html to design ) in figma but we don't find the pricing section , if any one help me
- Raheel Khan
- Most Thank for the developers who bring that unbelievable idea into reality and for free, This extension helps me a lot in my project, BUT! Today when I tried to use this extension for convert page into design, It's didn't converted for me and It's loading from long time, My internet connection is faster, I also tried to remove extension and I was installed again but still not working. :(
- Salah Jibril
- I really like using this plugin for client projects, especially when we don't have the designs in Figma. However, there's one issue that adds extra work. Right now, the plugin only loads designs in desktop size. It would be very helpful if we could choose different screen sizes. Adding this feature would make the plugin much more useful for designers. you gain a super FAN!
- BK K
- The conversion is great for when it works. I keep getting an error on certain screens: An error occurred during html.to.design conversion: Cannot access contents of the page. Extension manifest must request permission to access the respective host. Has anyone else experienced this and how do I resolve this issue?
- Louis Tromans
- LOVE THIS!
- Deepak Chauhan
- How can we use it on mobile app android and IOS.
- Krishnendu Chatterjee
- Can this plugin work on local file stored in the device can't find the options? I have created some html file need to convert it in Figma file. - yes, it works now.
- Linda MacDonald
- absolutely amazing!
- Matthew Ferguson
- It was an amazing plugin when it was working, but it's broken now sadly
- Jon Burke
- Plugin appears to be broken. Was working great a few weeks ago... Using it in Chrome on a MacBook.