Affinity Designer hex colours different to the export

[RichWard]

Hi, 

I'm a newbie and just bought Affinity Designer to finally replace Fireworks CS3 which I use to create, enhance and optimise simple web graphics (logos etc.) and photos. I work in Hex colours and colour matching is essential for me - but the hex colours shown on Affinity's artboard are different to the actual hex values - as in below screenshots:

Affinity Designer - red bricks in colour settings are #E1906E but the colour displayed is not correct. The greys are wrong too. 

  

PNG Export from AD - red bricks are showing #E1906E correctly - I need Affinity to show the correct colour for hex value too. 

I can see AD has tons of amazing features, but perhaps it's not right for my needs? Export sizes are also large in comparison to Fireworks, but that's another topic. 

Any help would be appreciated. 

Edited December 7, 2021 by RichWard

[BofG]

Please show screenshots of your document colour settings and of the colour panel with those objects selected, along with your export settings for the png.

Affinity does correct colour matching, so you must have something set incorrectly somewhere in the aforementioned areas.

[RichWard]

Hi BofG, thank you for your quick response. 

Here's the document setting which I believe is the default - I've tried using a Web template but the same colour difference remains. 

Here is the colour settings for the red brick object:

I appreciate any assistance you can give me.

[BofG]

PNG export settings?

[RichWard]

png export is on the default settings - I tried a couple of others, bicubic and png/8 for example and looked at the other presets but couldn't see anything that made a difference - I'm sure I'm missing something as many users must be creating colour accurate images for the web.

[BofG]

Nothing immediately obvious there..

I've made a document the same and I get the colour like your export, so it does seem the Affinity display is off.

Are you by any chance using a custom monitor ICC profile on your system?

[RichWard]

No, just standard Win10 settings for fairly cheap laptop

[BofG]

Hmm, I'm puzzled then... Can you post the Affinity document? (or just a re-made one with blocks of colour that has the same mis-match on export if you don't want to share the actual content).

[RichWard]

See attached AD file - I just tried some other random colours and pasted a screenshot of settings onto the artboard before export. Curously there also seems to be some disparity between the colour of the blocks and the colour in the settings fill circle. 

Affinity (colour not same as hex value)

Export colour same as hex value 

colour-checking.afdesign

[BofG]

Something is off with your system colour.

Press the Windows key + R (for the run dialog). Type into there "colorcpl.exe" without the quotes and hit "ok". You should see something like this:

Please screenshot that and what is on the Advanced tab and post those here.

[RichWard]

Here they are - I know the laptop's screen doesn't display colours well - I have a 2nd monitor which is closer to srgb - I'm not sure how that affects the difference between what affinity shows and what it exports?  Again, probably my lack of understanding.

[BofG]

Odd that there's no profile associated.

Anyway, change this:

To this:

(I'm not sure if you will need to restart the computer, you will need to at least close and re-launch Affinity).

[RichWard]

Thank you very much for your time looking at this - I have to go out now but will try the setting you suggest later. 

[RichWard]

BofG, 

That worked! Fabulous you've made my day - thank you so much for your help with this. Now I can crack on and start learning Affinity Designer. 

All the best, 

Richard