Mobile app version of vmapp.org
Login or Join
Connie430

: Different color when exporting png in Sketch 2 I have a problem when I'm exporting a .png file in Sketch 2. I have an icon with the background color of #8FBE00 but when I'm exporting it

@Connie430

Posted in: #Color #Export #Png #SketchApp

I have a problem when I'm exporting a .png file in Sketch 2. I have an icon with the background color of #8FBE00 but when I'm exporting it as a .png file the background color is #8EC003 . I have absolutely no idea what's going on, I've never encountered this problem when working with Sketch before. I'm no Sketch expert so maybe someone can help me.

10.03% popularity Vote Up Vote Down


Login to follow query

More posts by @Connie430

3 Comments

Sorted by latest first Latest Oldest Best

 

@Sims5801359

I've made a quick test with 2 exports from Sketch, with and without Color profile.



When I use the Mac DigitalColor Meter it measures exactly the same colors.

If I use Affinity Photo it's the same. It assigns a color profile to the png file that does not have it and measures the exact hexadecimal values.

Processing the images with a PNG compressor removing EXIF meta and color profile data does not change any values measured.

So


Sketch always save as sRGB (not gAMA) with the 'Save for web' unchecked.
If 'Save for web' is checked, opening that image in any software will append a color profile. Luckily would be sRGB and it will have the same created colour in Sketch.
Opening the png image in Safari will be interpreted as sRGB.

10% popularity Vote Up Vote Down


 

@Angela777

change the color mode and keep it with default RGB and while saving, save the image in PNG-24 format. i think this may helps you.

10% popularity Vote Up Vote Down


 

@Murray664

The problem may be that when you are working in Photoshop your file is being color managed. You can turn that off and it should allow you to maintain the color you want. I‘ve included a link that explains how to turn off color management in photoshop. bjango.com/articles/photoshop/ I found it through a link on hack design.

10% popularity Vote Up Vote Down


Back to top | Use Dark Theme