Color Management for the Web

Ausra

Posts: 1429

5 years ago

Hello developers,

There seems to be some confusion about color management for Web images. The tips below will cover the correct color management workflow for Web images, checking colors in Pixelmator and in Web browsers, and saving images for the Web.

Tip #1: Color management for Web images while in Pixelmator

When working with images for the Web, make sure you have applied the sRGB color profile to your images, unless you’re a highly trained expert user. This enables Pixelmator to read and calculate colors correctly, and then give you the results of the colors as they appear in your Web browser. All newly created images have automatically assigned sRGB color profiles.

Tip #2: Selecting and checking colors

Next, when you want to check whether you’ve got colors right while in Pixelmator, use the Eyedropper Tool. It can read the color profile assigned to your image and then present the color values correctly. To check and select colors in Web browsers, you can use other tools, such as Apple Color Picker, Digital Color Meter, or any other tool you find suitable.

Tip #3: Saving images for the Web

Once you’ve created the image, make sure you export it using the Share > Export for Web feature. This strips away the assigned sRGB color profile from the image, which is important, because it helps to match the image colors to your HTML colors.

P.S., Most color shifts appear in color-managed browsers, because images saved with embedded color profiles are converted to the computer screen’s RGB, and the unmanaged HTML color is sent straight through to the screen unchanged. If you use the Export for Web feature, the image colors will match the HTML colors and will blend in seamlessly.

P.P.S., The current Safari 6 update has some issues with color shifting. Read more about it here, and perhaps you’ll be able to find a solution:

https://discussions.apple.com/thread/41 ... p;tstart=0
http://www.freewaytalk.net/thread/view/114471
sujon

Posts: 3

1 year ago

This was exactly what I was looking for.Fast turnaround! Love your post! Great Ausra and Pixelmator!

Please sign in to post.