Hullo, if you are starting your web build journey or thinking of a re-design and you are desparate to add your favorite colours to your website then you might be interested in a handy tool that I use which will allow you to add a specific color to your design.
Interested? then read on…
A Very Short Web Color Lesson…
On the web, all colours have a specfic set of codes. They can be hex, RGB or HSL. (Don’t worry, you do NOT have to know what these things mean, only where you need to use them).
To keep things simple, I only use the HEX numbers. These are a 7 alphanumeric set of charatcters that all start with the hex sign “#”.
For example the code for White is #FFFFFF and the code for Black is #000000.
This colour is #C3264B
So how do you add your favorite colors to your website color set?
Say you’ve trawled the interwebs and looked up some fab sites with colors you really, really want on your website or social posts and you want to know how to add them. Getting those sought after hues is a very simple task, but it will need a handy FREE tool…
Part Of My Toolkit
As with most things involved with creating or maintaining a website, this process uses a tool. The piece of kit I use is called ColorZilla. It’s an app that sits in my Chrome toolbar.
Basically it’s a digital color picker eyedrop thingy that you drag to an area of a webpage and it tells you exactly what the hex code is for that color.
Oh, and it’s FREE
If you do not have this tool, you can get it in a couple of easy steps.
- Go to https://www.colorzilla.com/ and click on the Colorzilla for Chrome and Firefox image on the right of the screen
- Click the For Chrome menu option
- Click the Install ColorZilla button
Grab Your Favorite Color
I made this little video (2m and 3 seconds) to show you how to find out what your target web color codes are, but if you prefer a step by step guide then read on below to find out how I do it…
The Step By Step Guide
1.Go to the web page that has the color(s) you want and click on the eyedrop tool in the Chrome menu bar
Drag the cross hair to the section of the screen with the desired color
Either make a note of the HEX number or copy it to your clipboard to paste into your WordPress color scheme or graphics tool.
That’s A Wrap
I hope this was useful, especially if you are setting up your color pallet for your website and need to note your top web color codes.
As always, if you want to reach out with a comment or question, you can do so below or reach me on one of my socials, and if this was useful, please share it with someone who you think it could help.
Best of luck with your site.
Do Websites Confuse You?
Grab your FREE copy of the Straight Talk Web Guide HERE – No Email Needed
Leave a Reply