How to Capture Colours on the Web Using Colorzilla

All colours that you see on the internet are represented by a six-digit/letter code called a hex code (e.g. white is #FFFFFF, red is #FF0000 and black is #000000) This code is how the browser knows what colour to render your web elements.

Have you ever come across a colour on another site that you really liked and would like to replicate on your own web page? Or perhaps you’re wanting to add some text to your blog post that is the same colour as other elements on your web page? What about in adding colourful text to photos?

You can capture the code of any colour that you see on your web browser using a free add-on called Colorzilla. Colorzilla is available for both Mozilla Firefox and Chrome browsers.

It is easy to install and to use. The following instructions will help you install it on your Firefox browser.

In your browser window, choose Tools->Add-ons from the top menu. This will open up the Add-ons Manager.

In the search window at the top right of the page, search for ‘Colorzilla’.

Find Colorzilla in the search results and click on Install.

Searching the Add-On Manager for Colorzilla

The add-on will install and prompt you to restart your browser.
Restart the browser and voilĂ , the add-on is now installed.

Colorzilla is now installed.

 

To use the tool, open up a web page where you would like to capture a specific colour.

Click on the dropper tool to the right of the browser toolbar.

Use the dropper tool to select the colour you want.

 

Hover your mouse pointer over the element on the page where you’d like to capture the colour and left-click.

Capturing the hex code of your desired colour.

 

The hexcode has now been copied to your clipboard and you can paste the code wherever you like. You can provide the hex code to your Virtual Assistant for use in email broadcasts or web pages, or if you are doing it yourself, you can use it in WordPress and most content management systems to colour your text with your chosen hue.

Colorzilla isn’t just for hex codes. In Microsoft Office software, if you want to use a specific colour for text you need to use RGB codes (e.g. White is R=255, G=255, B=255). Colorzilla captures RGB codes too.

If you found this post useful, please share it on Twitter, Facebook or Google+.

Capturing Hex Codes: How do I use that colour on my site?

Leave a Reply