I have an image with a linear gradient overlay (banner image on this page EDF Energy - Our Campaigns. I have set the RGB colour in CS4 to R: 29 G: 31 B: 79. However, when I save the file for web the colour darkens slightly as you will see on the site. I want to colours of the background and edge of the banner image to match exactly. Does anyone know how to fix this?
Photoshop's default settings make matching RGB colours in images with colours in code near impossible. But, it's easy if you change a few settings. Here's what to do:
Choose Edit → Color Settings and set the working space for RGB to Monitor RGB.
If you’re using Photoshop CS6, click More Options and turn off Blend Text Colors Using Gamma, because it changes how non-opaque text is rendered. It should already be off, but if it’s not, turn off Blend RGB Colors Using Gamma as well.
Open a document and choose Edit → Assign Profile, then set it to Don’t Color Manage This Document. This must be done for every single document you work on.
Ensure View → Proof Colors is turned off.
When saving files with Save For Web, ensure Convert to sRGB is turned off. If you’re saving a JPEG file, then also turn off Embed Color Profile (there are some cases where you might want this on for photos, but chances are you’ll want it off for interface elements and icons).
The most important point is the last one. Convert to sRGB destructively changes the colour profile of your image from the document profile to sRGB, altering the values of each pixel.
More detail can be found here: Colour management and UI design
Please note: The instructions above are for Photoshop CS6, but CS4 is very similar. Illustrator is very similar as well.