• Global community
    • Language:
      • Deutsch
      • English
      • Español
      • Français
      • Português
  • 日本語コミュニティ
    Dedicated community for Japanese speakers
  • 한국 커뮤니티
    Dedicated community for Korean speakers
Exit
6

Import HTML to XD

Community Beginner ,
Mar 16, 2021 Mar 16, 2021

Copy link to clipboard

Copied

My team has a working HTML framework that was originally designed in Sketch but we're exploring switching to XD. The Sketch files don't quite match what has been developed and rather than importing the Sketch library and tweaking, is there a way to IMPORT the coded HTML INTO XD??? There is an "HTML to Sketch" tool, is there anything similar for XD? I haven't done an exhaustive search or test yet but wanted ask the community first.

TOPICS
How to , Import and export , Missing feature , Share or publish

Views

19.3K

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines

correct answers 1 Correct answer

Adobe Employee , Mar 24, 2021 Mar 24, 2021

Hi there,

 

Sorry for the delay in response. I am afraid, as of now, we don't have this feature available, however, we have received a similar request on the Adobe XD UserVoice: https://adobexd.uservoice.com/forums/353007-adobe-xd-feature-requests/suggestions/13245423-import-html-from-url-as-editable-static-content

 

Please upvote the request to add voice to the feature. This is the best way of sharing feedback with the Engineering and Product management team.

 

Regards

Rishabh

Votes

Translate

Translate
Adobe Employee ,
Mar 24, 2021 Mar 24, 2021

Copy link to clipboard

Copied

Hi there,

 

Sorry for the delay in response. I am afraid, as of now, we don't have this feature available, however, we have received a similar request on the Adobe XD UserVoice: https://adobexd.uservoice.com/forums/353007-adobe-xd-feature-requests/suggestions/13245423-import-ht...

 

Please upvote the request to add voice to the feature. This is the best way of sharing feedback with the Engineering and Product management team.

 

Regards

Rishabh

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
New Here ,
Oct 16, 2022 Oct 16, 2022

Copy link to clipboard

Copied

After next one and half year .... the most elementary feature is missing.

When I requested a trial, this was my first expectation: to read existing projects form html/css.

So Adobe forced me to enter credit card details, before I can see the product. The only reason is missing. Awful...

By by

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
May 19, 2022 May 19, 2022

Copy link to clipboard

Copied

For anyone else looking at how to do this ... namely, importing a webpage into XD ... I've found what works is this. You can first import the page into a free app called Figma. There is a plug-in for Figma called "Figma to HTML" and it's available here. You can also get an extension for Google Chrome (and Brave) to grab the page content.

 

The there's another plug-in for Figma which allows you to export Figma layouts to XD. You can get that here. It's called Convertify.

This is not exactly what the original poster asked how to do. However, you can export the HTML page from Sketch (in his case), and then import it into Figma. Then you can export it from Figma to XD. It sounds like a lot of steps, but I've found it only takes a few clicks.

 

I've found the whole process works very well.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
New Here ,
Jun 22, 2023 Jun 22, 2023

Copy link to clipboard

Copied

If you search long and hard, you can find a way to import into XD. Here was my method:

  1. Open a free Figma trial
  2. Go to Resources / Plugins, search for "Builder.io Generate Designs with AI & Export to Code" and install
  3. Click the Import from the Web tab and paste in your URL (you can pull in any page on your website)
  4. Go to Resources / Plugins, search for "Convertify Sketch/Adobe/Google" and install it
  5. Click the Export and select XD, import into XD

You will have to do some cleanup, but it will save you the labor of redesigning the whole page and importing all assets. 

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Jul 11, 2023 Jul 11, 2023

Copy link to clipboard

Copied

Hi Cory, I couldn'tfind the Builder.io plugin in figma - is it still there?

 

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Jul 11, 2023 Jul 11, 2023

Copy link to clipboard

Copied

LATEST

Update to my above query,realised I was trying to find the builder io plugin whilst in FIGJAM not design view. 

 

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines