Item logo image for HTML to Figma - by Builder.io

HTML to Figma - by Builder.io

builder.io
4.3(

46 ratings

)
ExtensionWorkflow & Planning100,000 users
Item media 1 screenshot

Overview

Import a web page to Figma layers

Use this extension to capture your current page and import it as editable Figma layers! What it's useful for - Easily import real live site styles for a starting point for designs and prototypes - Quickly turn real site components into design components - Easy import components from storybook, etc - Import a great live web design as a starting point for inspiration for your mockups View and contribute to the source code here: https://github.com/builderio/html-to-figma/issues

4.3 out of 546 ratings

Google doesn't verify reviews. Learn more about results and reviews.

Review's profile picture

Liz LucasFeb 12, 2024

This is super useful! You do have to use their figma plugin, which is not really noted here. If you go to the github for it (https://github.com/builderio/html-to-figma) and scroll down, it will show you which plugins to install to Figma (I used this one that was linked there - https://www.figma.com/community/plugin/747985167520967365/builder-io-ai-powered-figma-to-code-react-vue-tailwind-more) in order to upload the JSON file. Saved me a lot of time since I'm just now learning figma!

12 out of 12 found this helpful
Review's profile picture

Seth PrattDec 13, 2023

This is literally the best thing since sliced bread.

4 out of 4 found this helpful
Review's profile picture

Bhanu Pratap SinghDec 13, 2023

Could anyone guide me on how to use it? Which Figma plugin do I need to import the Figma JSON file created by this extension?

11 out of 11 found this helpful

Details

  • Version
    0.0.7
  • Updated
    August 31, 2022
  • Size
    343KiB
  • Languages
    English (United States)
  • Developer
    Builder.io, Inc.
    95 3rd Street, 2nd Floor San Francisco, CA 94103 US
    Website
    Email
    steve@builder.io
  • Trader
    This developer has identified itself as a trader per the definition from the European Union.

Privacy

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

Support

For help with questions, suggestions, or problems, please open this page on your desktop browser

Google apps