Inconsistent colors using Mac OS picker


I’m having trouble maintaining consistent color between my design app (Affinity Designer) and Hype. What I have done is I create a system palette (Apple OS) that is used in Affinity, which I then access in Hype. In theory these should be the same, but there is a difference.

I’m attaching a couple images showing screenshots of my palette in AD and Hype. In Hype, I imported the color wheel from AD, but then I drew individual circles over the colors…and in these I chose the SAME COLORS in the system palette, but you can see in Hype there is a difference. Doing the same in AD there is no difference.


Could you share your document? It would also be helpful to get a copy of the original color wheel to see where the color is going wrong.

From your screenshot, I’m getting an entirely different hex value for the color:


… but this is based off of your screenshot, so I’m not sure what to trust anymore :slight_smile:


Exactly. That’s not just in the screenshot. It’s what I’m getting too.

I have messed around this a bit more and ended up creating a test. Through the test I am still getting inconsistent colors. This is what I did:

  1. Create an ellipse in AD and fill it with a red. In AD I saved the color as a MAC system palette. There, it sets the color as #C42737.

  2. Then in Hype I create a new doc, and again add an ellipse. For the fill, I choose the same MAC system palette (the one I just created in AD) and the same red swatch there is now the value #D13D47.

Attached you will find the four files for this test.
The AD doc
An exported eps (from AD)
The Hype doc
The system palette, created in AD. (24.9 KB)

(Hans-Gerd Claßen) #4

loading this *.clr in a colorpalette in Textedit leads to expected colordefinition


Are you saying you get #C42737 in Textedit? If so, that’s what I get.

This should confirm everything is working properly except Hype.

(Hans-Gerd Claßen) #6

kind of :slight_smile: you’re right and its been meant as a hint …

(Jonathan Deutsch) #7

Affinity Designer is using a specific color space. Within AD, if you hover over the color under the test-red and compare it to the one in their swatcher, it will be different when looked at using Digital Color Meter app, for example.

The goal of how Hype handles colors is to be as consistent across browsers as possible (this is difficult as some browsers are color managed and others aren’t) and to also be able to use the same values in Photoshop for a PNG and have them appear the same next to a Hype element using that color in every browser.

Unfortunately color spaces generally can’t be transformed without losing data, and there’s no facility to do an automatic conversion from one app to another. If you use these colors in photoshop for example, you’ll also wind up with them not being the same.


Thanks Jonathan.

Are you referring to color spaces such as sRGB or AdobeRGB? I have worked with these for years and am familiar with the ways that graphics do not appear consistent from app to app. The challenge I have with this situation is the appearance is not only off, the actual values are skewed from a system palette. Imported PNGs do not match vector colors.

Is there some way Hype is interpreting the system palettes that is consistent? Is there a universal color space that web focused apps use? I thought that was sRGB. I have not had this issue in other apps focused on web technologies.

(Hans-Gerd Claßen) #9

hm, at least RGB-color-spaces differ from each other -> in theory and daily work :slight_smile:

so be sure to create a color in LAB to be independend from hardware …

if working with rgb -> use the same colorspace (lets ignore the rendering intend here …) in different apps.

load your palette.
choose your color
switch to rgb
choose the source-colorspace on the right

-> the hex and values should update …

@jonathan … though hypes OWN hex-displaying does not update!¿