Skip to main content
dnarciss18
Participant
Dec 16, 2020 1:14 PM UTC
Answered

Adobe XD: Importing Grayscale

Hey, I am trying to import assets from Illustrator to Adobe XD and when I attempt to drag the asset or import using the import option in XD, the assets are importing in grayscale instead of color. I tried changing color modes in Illustrator, etc but nothing seems to work. Please Help !

This topic is closed to new replies. Start a new post to keep the conversation going.
Spas K.
Spas K.Correct answer
Community Expert
Dec 17, 2020 1:13 PM UTC

Okay, so here's the problem - unfortunately, Xd can't handle gradient colors applied to a stroke / border yet. Gradients only work as a fill color. Your circles in Illustrator are paths with a stroke, and the gradient is applied to the stroke, so when you import into Xd, it converts that gradient to a solid color (default is gray). 

 

So if you outline the strokes in Illustrator (Object > Path > Outline Stroke), it will work fine, with the caveat that you won't be able to change the thickness of these circles after that in Xd.

View reply

6 replies

Spas K.
Community Expert
Spas K.Community Expert
Community Expert
Dec 16, 2020 4:38 PM UTC

Can you try to simply select the group(s) in Illustrator and do Cmd+C, and then Cmd+V in Xd? Not sure if that's different from dragging or importing, but give it a try if you haven't.

 

Also, in Illustrator, are these objects a group, or individual paths? Did you try ungrouping them completely and try moving them over like that? Sometimes illustrator applies the fill to the group or contents only, and Xd might not be reading that properly.

 

I'm pretty sure I had this problem some time in the past, but don't remember how I fixed it. An .ai file as Ares requested will help us figure it out (hopefully).

Translate
    dnarciss18Author
    Participant
    Dec 16, 2020 9:23 PM UTC

    Hey, thanks for those suggestions, however I did try the PNG thing and the problem is that I need the SVG format of the asset because I want to have control over the asset in after effects, the PNG will limit be being able to use the line paths. However, I'm fairly new to this site but here is the link to the AI file.

     

     

    https://www.dropbox.com/s/55855fq75n7k9hr/Pulse%20UI%20assets.ai?dl=0

    Translate
    Spas K.
    Community Expert
    Spas K.Community ExpertCorrect answer
    Community Expert
    Dec 17, 2020 1:13 PM UTC

    Okay, so here's the problem - unfortunately, Xd can't handle gradient colors applied to a stroke / border yet. Gradients only work as a fill color. Your circles in Illustrator are paths with a stroke, and the gradient is applied to the stroke, so when you import into Xd, it converts that gradient to a solid color (default is gray). 

     

    So if you outline the strokes in Illustrator (Object > Path > Outline Stroke), it will work fine, with the caveat that you won't be able to change the thickness of these circles after that in Xd.

    Translate
      Ares Hovhannesyan
      Community Expert
      Ares HovhannesyanCommunity Expert
      Community Expert
      Dec 16, 2020 4:21 PM UTC

      How you import it? Try to use Color RGB Mode in Ai or export your assets as png from Ai and them import into XD.

      Can you share your Ai file to test?

      Translate
        dnarciss18Author
        Participant
        Dec 16, 2020 9:25 PM UTC

        I exported the files from Illustrated then used the Import tab in XD, I also tried the other way of just dragging it into XD and nothing worked..

         

        Here is the link:

        https://www.dropbox.com/s/55855fq75n7k9hr/Pulse%20UI%20assets.ai?dl=0

         

        Thanks for the help.

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