Skip to main content
OnMission
OnMission
Participant
May 30, 2022
Answered

Adobe XD export PNG without Alpha Channel (Bug)

  • May 30, 2022
  • 2 replies
  • 2076 views

I think something changed in the latest version of Adobe XD. Before, when you exported an artboard with a background before, there was no Alpha Channel. This is because it wasn't needed. Now, however, the PNG export always puts in an Alpha channel, even if the background is present. Seams like this is a bug. An alpha channel should only be included if the background is less than 100% opacity.

    This topic has been closed for replies.
    Correct answer OnMission

    Thanks for the reply! @AkinGn is correct, Photoshop is definitely a workaround. For exporting large amounts of artboards and assets, I've been using Bridge to bulk remove the alpha channels. However, there are still a couple problems with this method…

     

    (1) The first problem is when a person/company has large amounts of assets that are being converted with automatic scripts. As a programer, the only way the scripts can tell whether or not a file contains transparency, is to rely on the alpha channel being applied correctly. All assets/artboards are exported from Adobe XD at 4x as PNG for quality and archive. We choose PNG over JPG for non-transparent images, since JPG will always have some artifacts. These assets/artboards are then compressed from their original files using scripts to be used in various situations over time.

     

    (2) It's not a huge deal to remove the alpha channel one one or two files, but it gets harder as the amount of files goes up. It gets even harder when the artboards/assets exists in separate subfolders, as Bridge can only bulk process images in a single folder. I can rely on other programs/scripts to bulk remove alpha channels even in many nested subfolders, but a computer isn't smart enough to determine the original intention of the artist and whether or not they wanted a transparent background or not. Since there is no "transparency" option when exporting from XD as PNG, it makes for a difficult an manual process when dealing with large amounts of files. 

     

    Version and System:

    • Adobe XD version 51.0.12.6 on macOS 12.4.
    • Steps to Reproduce:
      • Choose an artboard with a background color of 100% opacity (i.e. fully opaque).
      • Export it using 4x, PNG setting.
      • View details/information for the newly saved .png file, and one should see that an alpha channel has been applied regardless of background opacity.
    • Solutions:
      • Allow the user to choose "transparency" when exporting to PNG. However, this doesn't solve for the situations when some assets/artboards need "transparency" and some don't when exporting a large number of assets/artboards.
      • A better option would be to rely on the "background opacity" of the artboard to determine whether or not the final PNG gets an alpha channel. Either that, or give the user a "transparency" toggle on individual artboards/assets. The easiest solution, in my view, would be to check the "background opacity" of the artboard upon export. If it's 100%, no alpha. If it's < 100%, apply alpha.

    2 replies

    HARSHIKA_VERMA
    Community Manager
    HARSHIKA_VERMACommunity Manager
    Community Manager
    June 1, 2022

    Hi @OnMission,

     

    Thank you for reaching out. In addition to what our expert has suggested, is it possible for you to share a video showing the issue for better understanding?  Please also share the version of XD and the operating system you're working on.

     

    We will try our best to investigate the issue.

     

    Thanks,

    Harshika

      OnMission
      OnMissionAuthorCorrect answer
      Participant
      June 2, 2022

      Thanks for the reply! @AkinGn is correct, Photoshop is definitely a workaround. For exporting large amounts of artboards and assets, I've been using Bridge to bulk remove the alpha channels. However, there are still a couple problems with this method…

       

      (1) The first problem is when a person/company has large amounts of assets that are being converted with automatic scripts. As a programer, the only way the scripts can tell whether or not a file contains transparency, is to rely on the alpha channel being applied correctly. All assets/artboards are exported from Adobe XD at 4x as PNG for quality and archive. We choose PNG over JPG for non-transparent images, since JPG will always have some artifacts. These assets/artboards are then compressed from their original files using scripts to be used in various situations over time.

       

      (2) It's not a huge deal to remove the alpha channel one one or two files, but it gets harder as the amount of files goes up. It gets even harder when the artboards/assets exists in separate subfolders, as Bridge can only bulk process images in a single folder. I can rely on other programs/scripts to bulk remove alpha channels even in many nested subfolders, but a computer isn't smart enough to determine the original intention of the artist and whether or not they wanted a transparent background or not. Since there is no "transparency" option when exporting from XD as PNG, it makes for a difficult an manual process when dealing with large amounts of files. 

       

      Version and System:

      • Adobe XD version 51.0.12.6 on macOS 12.4.
      • Steps to Reproduce:
        • Choose an artboard with a background color of 100% opacity (i.e. fully opaque).
        • Export it using 4x, PNG setting.
        • View details/information for the newly saved .png file, and one should see that an alpha channel has been applied regardless of background opacity.
      • Solutions:
        • Allow the user to choose "transparency" when exporting to PNG. However, this doesn't solve for the situations when some assets/artboards need "transparency" and some don't when exporting a large number of assets/artboards.
        • A better option would be to rely on the "background opacity" of the artboard to determine whether or not the final PNG gets an alpha channel. Either that, or give the user a "transparency" toggle on individual artboards/assets. The easiest solution, in my view, would be to check the "background opacity" of the artboard upon export. If it's 100%, no alpha. If it's < 100%, apply alpha.
        OnMission
        OnMissionAuthor
        Participant
        June 2, 2022

        Also, I apologize for serveral grammar mistakes above. I missed several before hitting "post." Oops. 😄

          AkinGn
          Community Expert
          AkinGnCommunity Expert
          Community Expert
          May 31, 2022

          Hmm, I'm not familiar with the issue but I think opening the exported png in PS and deleting alpha channel there could be a workaround for now? If it doesn't help, let's see maybe some other team member might have a suggestion. Happy creating!

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