Skip to main content
D
danlewski
Participant
March 16, 2021
Answered

Import HTML to XD

  • March 16, 2021
  • 3 replies
  • 29390 views

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.

    Correct answer Rishabh_Tiwari

    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

    3 replies

    C
    Cory30089333m9s6
    Participant
    June 22, 2023

    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. 

      kohesion
      kohesion
      Inspiring
      July 12, 2023

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

       

      kohesion
      kohesion
      Inspiring
      July 12, 2023

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

       

      J
      Jonathan8989
      Participant
      May 20, 2022

      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.

        Rishabh_Tiwari
        Community Manager
        Rishabh_TiwariCommunity ManagerCorrect answer
        Community Manager
        March 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

          D
          David26626357k819
          Participant
          October 16, 2022

          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

            Terms & ConditionsAccessibility statement
            Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices