I recently started at a new company and the company paid a contractor for a logo. The logo is in Pantone 376 C and unfortunately contains a gradient with Pantone 382 C. I am working on web content, and I am struggling with a web safe color. The equivalent RGB of 132,189,0 looks much deeper on display. I know all displays are different my MacBook Pro and two monitors all make this color look different. With this being said, the Pantone 376 C looks fine while I'm designing in Indesign, however when I export to a PDF or a PNG and open that file it looks horrid on the screen. Any suggestions to make better web materials with the color I am given. Any RGB's I should use instead? I have to create 4 PPT slides that will be projected onto a large wall for a corporate function and I'm concerned.
Web Safe color palette is limited to 216 colors and it is a thing of the past (see here why). I don't think you meant that.
Pantone colors are the names of proprietary ink formulas. Those inks will look different depending on the type of the paper they are printed on. They will also look different under different light conditions. Your software tries to emulate those colors (convert subtractive colors to additive colors, inks to projected light). Different software emulates those colors differently.
This is because monitors do not use inks. Therefore you will need to specify colors for monitors using a color model that is supported by monitors. RGB, for example. But, as you mentioned yourself, all monitors are different, each will display colors differently. On some, the difference will be slight, on others will be significant. You can not do anything about that.
I suggest to spend some time and come up with RGB values for your brand colors and set them in stone (put them in the brand book guide). You can do that by matching the colors on printed materials with colors on your monitor. Use various printed materials, use different lighting conditions (day light, artificial light) and manually adjusts the RGB result on different devices.
Then keep all values in the brand book and use Pantone or CMYK for print and RGB for screens.
P.S. I would not rely on the help of the contractor who used Pantone colors as gradients.
The "safest" thing you can do is:
- Convert all images to sRGB, then strip the colour profile.
- Use #84bd00 in your CSS.
This will cause your images and CSS colours to match in the vast majority of browsers, including ancient ones like Netscape. The most likely reason your PDFs were messed up is because they were still in CMYK, and browser CMYK support is notoriously awful.
But if you're on a wide gamut monitor (such as most current gen Macs), you may notice that the colour still doesn't quite match Indesign. This is because 376 C is outside the sRGB gamut. Wide gamut support on the web is still very spotty and only a very small number of visitors have screens that can even show the colours you want, so I'd suggest sticking to the sRGB approximation for the time being.