Can I import a website HTML to Figma?

Can I import a website HTML to Figma?

HTML is a standard language for creating websites while Figma is a design tool that works with vectors. If you for some reason tried to import a web page into figma you probably got an error like this: 

Can I import HTML to Figma?

You can use a paid tool called magicul that basically converts any url you paste into a fig file, but it's expensive and it's probably not going to be perfect. 

But we have a better way, a free way:

How do I import a website in figma for free?

It's a plugin called builder.io and it's really great. You just paste your url and it automatically imports the whole page. It recognizes the fonts and it even lets you adjust the viewport width so that you can easily import the mobile version of a certain website. 

And it's completely free to use. It's really a modern technological wonder, that's what it is and I don't say this lightly. No but seriously it imports everything or at least 95% of the stuff without breaking it which is more than enough. 

BUT there are some limitations

  • frames won't work
  • not all CSS classes and properties work
  • videos and animated gifs don't work
  • if you're using fonts that are not google fonts you'll have to manually import them in figma

If you like chrome plugins you can even get the convertor tool in browser.

So, in short: if you're looking to get a website URL in Figma so you can make design changes or work on it there is a really cool and free to use plugin called builder.io which pretty much does everything for you automatically - you just have to paste the destination link. It imports everything! Not just the HTML, but the women and the children too! I mean the CSS too!