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

How to make image background transparent in XD?

New Here ,
Feb 04, 2020 Feb 04, 2020

Copy link to clipboard

Copied

Hi, XD Newbie here.

 

I'm taking an online class and trying to follow along with the instructor. He wants us to drop a clipart-style image into the page and change the color. It seems easy but all my images are on an opaque white background and all his are on transparent backgrounds. It feels like this should be easy to do, please help me.

TOPICS
Design , How to

Views

35.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

Community Expert , Feb 04, 2020 Feb 04, 2020

Yes SVG also allows for transparency.
If you can alter your images to png in PS then you should get the same results having transparency when importing to XD.

Votes

Translate

Translate
Community Expert ,
Feb 04, 2020 Feb 04, 2020

Copy link to clipboard

Copied

What file type are your images?
They will need to be png files for transparency.
This is something you need to set up before bringing the images into XD as XD will only alter the appearance of the whole image through the Opacity slider.

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 ,
Feb 04, 2020 Feb 04, 2020

Copy link to clipboard

Copied

He's using SVG images.

 

Should I just alter my images to PNG in photoshop then?

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 Expert ,
Feb 04, 2020 Feb 04, 2020

Copy link to clipboard

Copied

Yes SVG also allows for transparency.
If you can alter your images to png in PS then you should get the same results having transparency when importing to XD.

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 ,
Mar 24, 2023 Mar 24, 2023

Copy link to clipboard

Copied

I am using a png but still the background of the image comes up white. I use the same png in figma it is transparent. How do we modify that in XD? 

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 Expert ,
Mar 24, 2023 Mar 24, 2023

Copy link to clipboard

Copied

If you import it (Cmd/Ctl + Shift + I) ie. instead of drag & drop it should work

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 ,
Mar 27, 2023 Mar 27, 2023

Copy link to clipboard

Copied

Thank you but there is no such an option. I tried it and no action came up at all. Using a Macbook

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 ,
Mar 27, 2023 Mar 27, 2023

Copy link to clipboard

Copied

Ok the import option worked but still it puts a whitebackground to a transparent one. Nothing changed.

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 Expert ,
Mar 27, 2023 Mar 27, 2023

Copy link to clipboard

Copied

LATEST

That sounds peculiar - can you possibly send the PNG file to me so I can take a look...?

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