Among the most tedious tasks in Screendesign are
a) populate your design with credible data
b) keeping your design files in synch with changes that are implemented in the product
Those two things take up too much time when designing a new feature for an existing product. Most of the times I end up copying and pasting parts of the UI from my browser to avoid recreating them in XD and glue them together with new elements that I'm actually working on at the moment. We have computers we should not waste our time recreating things that are already there.
It would be extremely helpful if I could export an editable comp directly from the browser. I think this would work best as a Browser PlugIn, so that you could capture any state of the app you are currently working on, with the desired resolution etc.
I am aware that this is a large feature, but the conceptual similarities between the DOM and XD objects should make this feasible.
Imagine how easy this would make for any existing web project team to migrate to XD...

I know that this feature would also lower the barrier for copycats who would use other people's design as a template and present it as their own. But I feel limiting the possibilities for legitimate creators in hopes to slow down illegitimate use has never proven to be successful on the internet.

Figma has this great tool where you can capture html/css from any site and import it into an artboard. Figma Chrome extension here: https://chrome.google.com/webstore/detail/html-to-figma/efjcmgblfpkhbjpkpopkgeomfkokpaim?hl=en-US

والله إنك صادق ميزة ممتازة إن شاءالله الشباب في ادوبي يحطونها

please add this as it's a critical UX improvment feature.

Best way to do this is to collaborate between Figma and XD.

Follow these steps:
1. In Figma, import url with plugin "Figma to HTML, CSS, React & more!".
2. In Figma, use plugin "Convertify Figma to Sketch/XD" to export artboard in .xd format.
3. Open exported file in AdobeXD
4. Voala!

I do it all the time! There is an application called "page layers" it allows you to turn a web page into a .psd file.

Using the software you can "Save as" and preserve text "Generate text layers" then you get a .psd you can open that in XD. It works 90% of the time! Preserves groups and text, works best if the web developer coded it properly.

The only hitch is inline links get turned into multiple text boxes and they stack on top of each other. Only takes a few min to fix.

Yes, it will be really helpful have a tool can convert an HTML to AdobeXD elements.

More and more I find myself in the position where I need to do design reviews of whole sites and apps as well as suggest redesigns. Being able to do this in my preferred prototyping tool would help greatly.
(also, app to XD?)

so when is Adobe going to listen to all these creators? I hope they bring importing HTML and CSS codes features soon.

Who ever merged my feature into this, I need to talk to that person, since it is not the same..

I want a feature to be able to scrape the stuff from static html into XD, without the need of doing it VIA desktop environment containing XD. I want a file that can be generated from static content, and then imported into XD, not a "Import from html" function inside XD.

For example, for reach release, a job is run in the cloud (for example Azure Pipelines), creates a valid XD file that can be used as a design system file in XD

What's in prod is usually the real source of truth, it would be good to sync this back into XD, and not have to adjust files manually.

I've worked with the customers design system for over 4 years, and we've used Sketch before. With the API sketch provides, we could generate sketchfiles from html/css from our design system into Sketch, providing with a complete, version controlled source of truth.

Could this be possible with XD? say we have a static page with all the button variations and states, and I want to generate new XD files every time I release, making sure all of our designers always have the latest, updated verison, with option to look to older versions.

A solution for "in the mean time" could possibly be:

• Convert the HTML to SVG

• Bring that SVG into XD

I have software named "Page Layers" for mac that enables us to save a layered .PSD of a webpage which we can import into XD. Real time saver, curious if there is something that skips this step.

I understand that Abode XD is used as prototyping tool . But almost ,60% work frontend can be utilized in it. So I felt abode XD should export html files and also should import html into .XD file for backward compatibility . Just felt it be interesting.

I'm wondering whether this should be a browser plug-in rather than a feature of the XD desktop app.
As a browser plugin:

I could print out any application that is not publicly available (logins, localhost, internally hosted apps...)
I could replicate any state of the webapp that does not have a specific URL (single page apps, error states, one particular step in my checkout process, ...)

While I see tons of benefit in having a workflow to export style changes back and forth. It's important not to dilute the scope of this feature. Technically the web is a super diverse and while one fraction sees benefits in a dremweaver integration others are hoping to maintain their react or vue components and yet another fraction wants bootstrap... Exporting code is widely discussed in other feature requests.

I hope everybody here can agree that the ability to export a HTML document to XD alone is valuable enough to support this feature.

That would be really helpful. Just importing a page from live html site. I would love to see that in action.

I would love to pull an HTML page into Adobe XD with just the URL . Doesn't need to crawl the whole site I just need to upload a couple of pages that are examples of particular templates.

A plugin to import HTML web pages to layers in XD