App Icon colors don't match Display P3 color profile (16 bits / channel)

Hi,

Overview:

  • My app's icon uses Display P3 colors.
  • The PNG when opened in Preview seems to have the correct colours, but when added to Asset catalog as App icon, the installed app's app icon doesn't have the correct colors.
  • The Preview app's inspector shows the following:
Colour Model: RGB
Depth: 16
DPI Height: 72
DPI Width: 72
Orientation: 1 (Normal)
Pixel Height: 1,024
Pixel Width: 1,024
Profile Name: Display P3

Steps followed:

  • I have an app icon that uses the Display P3 color profile.
  • In Sketch, I have assigned the P3 Display color profile, exported as PNG.
  • Realised it was using only 8 bits / channel color depth.
  • So opened PNG in Pixelmator and changed color depth to 16 bits / channel and exported the PNG.
  • The PNG when opened in Preview seems to have the correct colours, but when used in
  • I even tried to use Display P3 Gamut in asset catalog and provide the same icon for sRGB and Display P3, yet the installed app's icon's colors don't match

Questions:

  1. What should I do to correct this problem?

Any help would be much appreciated.

Replies

The color tone depends on the screen type, I mean, you will not see the same color on a screen with true tone on, as in others. Also if it's OLED or another type.

I am using the same computer display (Studio Display), when I open the icon image file in Preview color is correct, but when I see the underlying file in the IPA (inside the IPA) the color is wrong. Also when installed on the iPhone which supports Display P3 the color is wrong.

I feel I am missing something obvious, because according to Xcode it seems to support Display P3.

I even tried individual icons for Display P3 and sRGB. I used the same Display P3 icons in sRGB and Display P3 slots.

I have exactly the same problem. It's not just a different color tone due to different screen. I know because I took a screenshot and viewed it on my Mac screen next to the original design drawing of the icon. It has definitely been converted from .p3 colorspace into sRGB.

com.bluemangoo.tiennm642

Exactly, somehow Xcode is converting the P3 into sRGB in spite of explicitly specifying P3 assets and also the P3 assets have the correct metadata (color profile as P3 and color depth as 16 bits / channel)

This seems like a bug in Xcode 14.3, it would be great if someone from Apple could verify this.

  • I made a demo app with both in it except the icon. For the icon I filled the background with a red color in p3 color space that exactly matches the sRGB color [r:1,g:0,b:0]. On top of that I drew a star using the display p3 version of the color [1,0,0]. If the icon is displayed correctly in p3 color space you can see the red star because it looks brighter than the background. However, if the icon gets converted to sRGB you do not see the Star anymore because foreground and background look alike

Add a Comment

I sent the demo app to Apple as a bug report. It would help if other people who are having this problem would also file bug reports. I recommend sending a similar demo app to ensure that Apple developer support understands that this isn’t just a problem due to different screens displaying colors with a different tint.

  • Thanks a lot, I will also file a feedback, thanks for confirming the issue

Add a Comment

I believe I've identified a solution to the issue. When exporting icons from Sketch as PNGs, ensure that the "Save for Web" checkbox is unchecked. Otherwise, Sketch removes metadata from the file, and Xcode doesn't recognize it as Display P3. You may need to click the "Show Options" button to access this checkbox