1. How many colours at once can one pixel contain?

  2. Is there a tool that can represent this pixel in a form of HTML colour codes? (And if there are many colours in this pixel, can this tool show the order of how colours are distributed all over the pixel - it's like 4 colours in a pixel and it says that colour #NNNNNN is placed first on the left, then second is on the right and so on - or in any other explanation)*


Short answer: One pixel can contain one color (and one value for opacity, but that's not relevant here). The different letters/number you see in your color code are the values that constitute it.

HTML colors are defined using a hexadecimal notation (HEX), those are the letters/numbers you see, and they are the combination of Red, Green, and Blue color values (RGB).

The lowest value that can be given to one of the light sources is 0 (in HEX: 00). The highest value is 255 (in HEX: FF). HEX values are specified as 3 pairs of two-digit numbers, starting with a # sign, the ones you mentioned. These are not 3 different colors in one, but one color made of them (because all colors are combinations of red, green and blue).

This site will give you a better view, as it shows how colors are constructed in HEX codes.

You can get the value of any pixel in your photo using for example a color picker in any graphic software (Photoshop, Gimp, etc), and use this code in web. All browsers will understand this HEX language.

If you want to convert your whole image to HEX, you can use a converter. I haven't tried any, but if you do a search for "convert image to HEX" you will be able to find a few.

  • Oh, that's great! I will get back to you sooner or later. I should try some first. Thanks – Tema Feb 7 '13 at 23:08
  • Please do, if you find one that is good it might be useful for someone else. The ones I found were more than 10 years old! – Yisela Feb 7 '13 at 23:12

Since this seems to be web-focused: you can get a colour picker add-on for most browsers that let you click any pixel and get its colour code right there, including in HTML hex format. Colorzilla is a longstanding popular choice for Firefox and Chrome.

(Internet explorer actually has one built in, believe it or not... ctrl-k or Developer Tools (F12) > Tools > Show Color Picker brings it up)

As well as the basics - click any pixel on any web page, and it'll tell you what colour it is - it has a bunch of other handy features including a DOM Color Analyzer that gives you an instant palette of the colours used in text and backgrounds on a page, and a built in CSS gradient generator. It's one of three web design supporting add-ons I use all the time (alongside MeasureIt for measuring pixel dimensions and Firebug).


enter image description here

Color analyzer example (results at bottom):

enter image description here

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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