iOS - color on Xcode simulator is different from the color on device

Credit goes to @jtbandes for suggesting to send screenshots which led to the solution

I am just answering the question for completeness.

Steps I followed:

1. Take a screenshot of image in storyboard
2. Take a screenshot of image in device (use mail / photo stream back to your mac)
3. Use color picker (part of mac OS color palette) to pick the same spot on both the screenshots
4. Note down the RGB values (available on the mac OS color palette) of spots chosen in step 3
5. compare both the RGB values and see the difference
6. add the RGB offset to match the color.

My RGB offset (not be followed blindly)

based on my experience, i added the following RGB values to get the color I wanted, it is only rough and worked for me:

• Red +12
• Green +19
• Blue +16

Different angles (best to keep it horizontal)

Holding the phone in different angles also gives different shades, keeping it horizontal did give the color

It's about color spaces.

Make sure you are picking the color from an sRGBcolor space, and replicating its RGBA values on Interface Builder by selecting sRGB IEC61966-2.1 from the dropdown menu.

If you pick a color in one color space, and generate it in a different color space, it will look different, in spite of having replicated the same RGBA values.

Also, have in mind that when you generate a color through code, using UIColor(red:green:blue:alpha:), it's generated on the sRGB color space by default. That's why it's so convenient to use this one (instead of Adobe RGB, P3, or any other). Besides, sRGB is the standard that's most used in the industry currently.

Fun fact: That UIColor constructor I mentioned above creates colors in the sRGB space since Xcode8. Before, that function used to create them within the Generic RGB space instead. That's why it might cause confusions too.

Here is a resource that extends on the topic: https://medium.com/@volbap/working-efficiently-with-colors-in-xcode-bc4c58b16f9a

The current (as of 3/17/14) CGColorSpace reference includes the following text, which says that sRGB is the native device color space for iOS.

Color Spaces and iOS: iOS does not support ColorSync, so all assets should be provided in the native device color space: sRGB.

As others have pointed out, this is an issue of Color Spaces.

Two tasks need to be performed:

1. Get the source color using the sRGB color space.
2. Set the color in Interface Builder, using the sRGB color space.

Task 1

You can use Apple's Digital Color Meter app to sample the required color, using the Display in sRGB option, but the output is very limited.

Another option is to use an app like SipIt (available free on the App Store, last I checked). Make sure you are sampling in the correct color space by performing:

Preferences -> General -> Color Profiles -> sRGB

You can also set your output format (e.g. hex string).

Task 2

In Interface Builder, open the Color window, choose the the second pane, choose "RGB Sliders". Then click on the cog icon to choose the sRGB color profile.

Once done, paste your color value in to the Hex Color # field

You're done! Your colors should now match.

I am not affiliated with SipIt in any way. But I've been using it for a few years and it is very handy. I'd recommend it to any designer.