Take the 2-minute tour ×
Graphic Design Stack Exchange is a question and answer site for Graphic Design professionals, students, and enthusiasts. It's 100% free, no registration required.

I want to learn the CMYK/RGB or any other details of a colour on a website. Say the side/background of this very website. I want to recreate that colour.

Can anyone help me? Or is there any specific software for that?

Please help.

share|improve this question
5  
Do you specifically need CMYK? Because it's used for print, but for web RGB is all you need. –  Yisela May 7 at 3:58
    
If you are using a MAC, there is always the digital color meter that is native to OSX and found under the Utilities folder in Applications. –  ckpepper02 May 7 at 13:52
    
I use Ubuntu, so there's no Photoshop, no MS Paint, and no digital colour meter. #LinuxFTW. –  Abhimanyu May 9 at 3:29
add comment

10 Answers 10

up vote 8 down vote accepted

As per thebodzio's answer, there's plenty of ways to get that colour. No matter what browser you use there will be some sort of colour picker add-on you can get. Alternatively you could take a screen shot and open it in photoshop. Another way is to open developer tools and look at the sites stylesheet, in chrome you could right click the background and hit inspect element then look for where the background colour is being specified...

To save you the trouble though, the background colour on that website is #f9f9f9 - now, if you're not too experienced with CSS, you might want to head over to the site, inspect the background colour and see if you can find where I got that from :)

share|improve this answer
    
Thanks, that solved my problem. –  Abhimanyu May 9 at 3:28
add comment

As to the page elements (excluding images), their colour (in RGB, sometimes in HSL) can be determined in a lot of different ways. One of the easiest is using any “developer tools” available in almost every contemporary web browser (Firefox, Chrome etc.). Colours in images can be sampled with any image editor having a tool like “colour picker”.

Having said that… It's not enough just to “get the RGB colour” and convert it to, say, CMYK. The tricky thing is to know which RGB and which CMYK you want to convert to and how do you want to deal with the outside-of-the-target-gamut colours. Yes, there's more than one RGB or CMYK. It's often silently assumed that when nothing is said about colour beside it being RGB, then it's really sRGB colour.

Anyway, I strongly recommend you to take a look at some introductory material about colour management. http://www.cambridgeincolour.com/color-management-printing.htm is one of the best around.

share|improve this answer
add comment

There are two ways to get the colors from any website webpage etc....

1) Using Browser Color Picker Add-ons e.g ColorZilla

2) Take screenshot of your webpage by using Print Screen button on your keyboard and paste that image in Photoshop or any other image editing software and pick color from there with color picker tool

You can also use browser add-on like Fireshot to take screenshot of whole webpage and take colors from anywhere on that page

share|improve this answer
add comment

If you are using Chrome you can simply hit F12 and show the page elements. On the right are the page styles which use the Hexadecimal codes for colours. These in turn translate into RGB colours.

For example if I scroll down a short way on the styles tab I can see that the background colour for the page is #f4f4f4. The equivalent RGB colour is: R: 244 G: 244 B: 244

It also show the pattern image and tells me it's a repeat etc etc.

share|improve this answer
add comment
  1. There are some colour picker add-on for all Browsers
  2. There are some websites that will find the colours of your website http://www.checkmycolours.com/

    http://html-color-codes.info

  3. Take a screenshot and open in Photoshop or Gimp you can pick the colours
share|improve this answer
add comment

I always use Colorzilla for this type of thing. It's a neat extension that lets you select colors directly from any page and gives you the color in different formats.

Also, just as a bonus, there is Web Colour Data which gives you the color palette used on a given website.

share|improve this answer
add comment

In addition to Chrome extensions/Firefox add-ons, ColorCop is a lightweight Windows desktop application that does the same thing. It can generate RGB and hex values of the colors you'd like to get using a sampling tool.

share|improve this answer
add comment

There is a new 'Eyedropper' tool included with Firefox that lets you point at a pixel, view the colour hex value, and copy it to the clipboard.

share|improve this answer
add comment

There are various ways to achieve so, like taking a screenshot using Print Screen button and pasting that into MS Paint (I am considering MS Paint as that's the default software anyone will have if working on a Windows machine), and use Color Picker

enter image description here

Once you do that, click on the color you want to get the rgb value.. and then click on Edit Colors option..

enter image description here

And you will get a modal with the information of the colors

enter image description here


Other way to achieve this is way easier than the above option, is to use a Color Picker plugin, I use Colorzilla for Firefox

Here, you will get a simple color picker on the AddOn bar, you need to click on that and you will get a Cross Hair cursor, click on the color you want to get the information for and you will get the below...

enter image description here

share|improve this answer
add comment

The little tool that I like to figure out colors is called Pixie, from Nattyware.com. It's free, tiny, very simple. Used it for years. Runs as a service; just click on a color and a window pops up and tells you hex, RGB, HTML, CMYK and HSV, plus mouse coordinates. Windows only.

share|improve this answer
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.