All Articles

The iOS 10 SDK introduced a change that (if you missed it) could cause some serious confusion. The exact change was that, as of iOS 10 SDK, the UIColor init(red:green:blue:alpha:) initializer began using the extended sRGB color space. The confusion around this comes when your interface builder color picker is NOT setting colors according to this color space. If interface builder is setup to use sRGB and targeting iOS 10 and later, then you’re not going to run into this issue. But if it isn’t, this issue can cause some real headaches. 

For more information about this change, see Apple Docs for UIColor under Color and Color Spaces.


For Example:

Imagine that you have a screen in your app that contains a UINavigationBar and two UIView objects, all of which are supposed to have the same orange background color. The nav bars color is getting set in code

UIColor(red: 255.0/255.0, green: 102.0/255.0, blue: 0.0/255.0, alpha: 1.0)

so that all nav bars in your app have the same color background. The two views background colors are set in your .storyboard file to the same RGB values.

Red: 255


Green: 102
Blue: 0


You run the app, only to find that the nav bar background color is not exactly the same as the buttons even though you set them both using the same RGB values. So what gives? You may begin playing with the nav bar settings because there are various modes on a UINavigationBar, such as isTranslucent and barStyle, which can effect the appearance of the color. After going down a long rabbit hole, you could still end up with different colors.


What’s Going On?

To avoid this kind of lost time, first ensure that the storyboard is setup to use the same color range as the UIColor init method employed. In our case, the init is using the sRGB color range, which is not something that is obvious. So by ensuring that the storyboard colors are using the same, we can resolve our issue. How do we do that? Below is an example where 4 views background colors are set differently.

View One:

Set in code with

UIColor(red: 255.0/255.0, green: 102.0/255.0, blue: 0.0/255.0, alpha: 1.0)

View Two:

Set in storyboard file with color profile of Display P3.


View Three:


Set in storyboard file with color profile of sRGB.



View Four:

Set in storyboard file with color profile of Generic RGB.



Views One and Three match, but the others are not the same. By ensuring that the value in the storyboard is set to the same color space (sRGB) you can ensure that the colors will match up. However, what if we actually want a color space other than sRGB? There are other init methods that we use on UIColor to handle those cases. Some examples are: 

Device Gray Color Space:




DisplayP3 Color Space:


See Apple Docs for UIColor init methods to research the various options available.


Get App Development Help from Five Pack Creative

At Five Pack Creative, we specialize in mobile app development for all platforms, including iOS. If you have questions about your app, or need help launching it, contacting us today to learn how we can assist you!


You May Also Like…

Five Pack Creative Listed as a Top Developer by Clutch

Five Pack Creative Listed as a Top Developer by Clutch

On average, 75% of mobile users in advanced economies own smartphones. Mobile applications are optimized for mobile devices, making them easier to use than going through the company’s traditional website. That’s why it’s no surprise that more companies than ever are...

The 5 Core Principles of Mobile Maturity

The 5 Core Principles of Mobile Maturity

Unless your team has been operating under a rock for the past decade, it’s common knowledge that mobile experiences dominate virtually all other digital touchpoints today. Recent Google research found that two times more brand experiences occur on mobile than anywhere...


  1. Brandon

    This page needs to be fixed! there aren’t any images and instead you have html everywhere… I couldn’t really properly understand what was going on, but i wish i could!

    • Five Pack Creative

      Thanks for notifying us Brandon. There were some issues from a previous version of our website. We have fixed the formatting now and hopefully this is still useful.


Submit a Comment

Your email address will not be published. Required fields are marked *