Photoshop, Monitor Colours and Colours for Web

2 min read
Reading Time: 2 minutes

You may have noticed that images you process in Photoshop do NOT look the same as when you display them in your browser or on other software. The colours are typically more saturated and bright when displayed in Photoshop (though the opposite may also be true).

Hover over photo to see difference

This is because Photoshop calibrates its image display depending on your monitor and attempts to show you true colours. Photoshop does not assume you are editing pictures for the web. It is also used for print which requires different colour calibration.


Web Only Solution

If you never have any intention of printing your photos, then you can change your photoshop display settings as follows:

View >> Proof Setup >> Monitor RGB

Now you’ll see exactly what you get in other devices.


Pro settings for print AND web

If you intend to eventually print your images, then it is better to use the default Working CMYK setting and save a copy of your work for use on web with the function

File >> Save For Web & Devices

You will therefor have 2 copies of every image: the working copy which can eventually be used for print and the web copy. The web copy, you will see, has the same vibrance and colour saturation as you see when editing in Photoshop.

Note that this function can take up a fair amount of RAM. You may need to resize your image before Saving for Web (or simply create an action which resizes, saves for web, and reverts to the original size).