We design & develop
beautiful websites interesting apps impactful identities working strategies incredible gadgets intelligent systems
that captivate your users that create huge revenue that make you stand out that will push you forward that make your life easy that automatize processes

By :  Manish Bhandari / February 20,2014

Many a times you must have noticed that the image you had created in photoshop and imported in your website looks differently. The one common problem is to trying to match colors in images to colors generated by HTML, CSS or code. One important point may ask is that  there can be differences when exporting images due to color profiling, but when setting the color code, how can this be different from photoshop? Or why the same Hex Color looks different in photoshop and browser?

The reason I will tell you now is that about 90% people just use Eyedropper tool to get color from the image itself then copy color code from color picker that gives you the result what you complaint about. The problem is in Photoshop and not the browser itself. This is just because photoshop’s color management is applied only to the image portion of its windows and to the files it saves. This color correction happens as Photoshop draws the image on screen, so software utilities that measure color on screen often report different colors from the ones you have specified. It’s worth noting that OS X’s color management is applied on top of Photoshop’s.

This article aims to solve those problems once and for all. For color precision, follow three steps given below :

Step 1: Color Profiles :

  1. Open Photoshop
  2. Go to Edit / Color Settings.
  3. Check whether first field (Settings) is selected as Custom.
  4. Point at the “Working Spaces” section and select the sRGB IEC61966-2.1 profile from the RGB drop-down.
  5. Uncheck "Ask When Opening" in Color Management Policies. So that whenever you open an image in photoshop, you will already have a color profile.
  6. The other settings can be kept unchanged here as we’ll only be working with RGB for web images.