: Changing the colour space of a website - or some other way of getting vibrant colours I have a website that uses some very vibrant colours. One of them, according to Photoshop is (in hex):

@Becky351

When working in sRGB colour space, there are two problems with this colour.

1) The given colour (Adobe RGB 117 208 237 or #75d0ed ) is defined in terms of the Adobe RGB colour space.
If an ignorant browser directly uses this RGB value as sRGB value, the result would obviously be a completely wrong colour:


2) The given colour is outside of the sRGB gamut.
Therefore, the Adobe RGB value of the given colour value cannot be correctly converted to a corresponding sRGB value.



You may want to consider two solutions for these problems:

a)
Various browsers support ICC profiles (ICC version 2 or even version 4).
You may work in Adobe RGB colour space and use the given colour if you embed the Adobe RGB (1998) ICC Profile.
For example, both of the following squares have the same RGB value 117 208 237; however, the first square has the Adobe RGB (1998) ICC Profile and the second square has the sRGB IEC61966-2.1 ICC Profile.


If both colours look identical, your browser does not support ICC profiles (like Internet Explorer 8). For further tests see Is your system ICC Version 4 ready?

b)
You may convert the Adobe RGB values to sRGB values and then work in sRGB colour space. If you cannot correctly convert the Adobe RGB value to a corresponding sRGB value (as in the given example, since the colour is outside of the sRGB gamut), you may want to select the closest matching sRGB colour.
For example, the given Adobe RGB value 117 208 237 corresponds to the sRGB value −8.3 209.2 238.7, which is outside of the sRGB gamut. The sRGB value of the closest matching sRGB colour is 0 209 239.



Note: The actual appearance of these examples depends on the capability and calibration of your system.

Vote Up Vote Down

@Holmes874

This article by Marc Edwards (who comments here too) should be used to set up Photoshop for designing websites: bjango.com/articles/photoshop/

Additionally, if you were to start with a new PSD, opening a new document of type 'Web' should do that for you by default (in Photoshop CC at least): cloudup.com/cjx5xj8jcjO (and if not using 'web' Document type, make sure you select 'Dont color manage this document' for Color Profile).

Vote Up Vote Down

@Angie364

Yes, it's because of Adobe RGB color space, it's much larger than sRGB.

Best practice for sRGB is to preview the colors in Save for Web Dialog. If you want to see the result immidiatly you can setup sRGB as default color space in photoshop. Click Edit > Color Settings and choose sRGB as RGB Workspace.

If the color profile of the photoshop file and your working profile is not matching, a dialog appears when you open up the photoshop file. To prevent issues, don't convert the colors to another profile.

Note: Websites are displayed in sRGB, it's impossible to change the color space of browsers. Also there is no universal display calibration, so nobody will see the same blue on their screens anyway, but you can try to get a average color of it by testing different screens.

Further links:

en.wikipedia.org/wiki/Adobe_RGB_color_space http://en.wikipedia.org/wiki/SRGB www.kenrockwell.com/tech/adobe-rgb.htm

Vote Up Vote Down