CMYK Files Can Render Inaccurate Colors When Viewed in Web Browsers

CMYK Colors Look Different OnlineWe are finding that some Mediabox-DAM and Mediabox-PA users who upload files based on the CMYK subtractive color space are having issues with thumbnail preview color accuracy in web browsers. Although the colors are perfect when the uploaded files are downloaded and opened in the original applications, we know that many Mediabox users count on the thumbnails and previews rather than downloading every file they inspect.

Adobe Defaults to Exporting CMYK JPEG Files

Adobe appears to export CMYK JPEG files (instead of RGB JPEG files) by default from Illustrator, InDesign and other apps when the main file is set up as a CMYK project, in order to more accurately preserve the colors. This can be quite confusing since few people realize this is possible, and most everyone assumes that JPEG files only contain RGB color data. In fact, only in recent years did most image applications (aside from professional photo and graphic design tools) and operating systems support CMYK JPEG files.

The problem is that there is no single way to convert a CMYK JPEG file to the RGB JPEG file expected by web browsers, and in fact, there is no single way to convert CYMK color to display on a monitor or any RGB device. Conversely, there are many RGB colors that are too bright to be represented by CMYK colors at all. There are all kinds of formulas and assumptions about this conversion process that can be made, so most applications pick one arbitrary way to do a conversion that won’t be accurate for many of the CMYK files out there. The only way that a color conversion from CMYK to RGB can be close to accurate is if the JPEG file contains an embedded ICC color profile and the application doing the conversion knows how to use the ICC color profile information correctly. We can open up a CMYK JPEG file in many different image viewer applications here in Windows and it is a coin toss as to whether you will see dark muted colors or over-saturated colors on the same monitor using the same file. Unfortunately, Adobe applications do not currently default to embedding ICC color profiles in the CMYK JPEG files they produce, as far as we have seen.

Two methods produce preview color accuracy in Mediabox-PA and Mediabox-DAM thumbnail and preview images.

Mediabox-PA and Mediabox-DAM try their best to keep colors accurate, but as detailed above, there is no way to render accurate color previews when converting a CMYK JPEG file with no ICC color profile to the RGB JPEG format we deliver to the web browsers. There are only two methods we believe can resolve this issue:

1) JPEG files must be exported from Illustrator, etc. in RGB format, (more specifically, using the sRGB color space), before uploading the files to Mediabox-PA or Mediabox-DAM

2) Uploaded CMYK JPEG files must include an embedded ICC color profile

Either of those two methods should produce an accurate representation of color in our thumbnail and preview images.

I have included some links below that cover some of the issues we (and everyone dealing with color conversions) are referring to:

CMYK to RGB conversion
http://en.wikipedia.org/wiki/CMYK_color_model#Conversion

CMYK color space general info
http://en.wikipedia.org/wiki/CMYK_color_model

RGB and CMYK color modes in Adobe Illustrator
http://mlp-vectorclub.deviantart.com/journal/To-all-Adobe-Illustrator-users-RGB-and-CMYK-Modes-353689159

Why are colors shifting when converting from CMYK to RGB in Photoshop?
http://graphicdesign.stackexchange.com/questions/5138/why-are-colors-shifting-when-converting-from-cmyk-to-rgb-in-photoshop

If you need some extra information on embedded color profiles and checking files for them, please see this article:
http://ninedegreesbelow.com/photography/embedded-color-space-information.html

 

We are currently investigating a way to detect when an uploaded file is using CMYK color space without an ICC profile, so that we may alert the user that the colors may not be accurately represented on screen. It won’t be available until later in the year, so in the meantime we suggest that one of the two solutions above be implemented for images that have precise color needs.

For questions or more information on this article, contact support at [email protected].

Guest post by Brian Contario, Director of Information Technology, MyMediabox

[Update 12-Aug-2016]