Match text ads color with website template using EyeDropper tool


Last modified date

Comments: 0

This post has already been read 111 times!

I’m going to show you how to match your text ads color with your website theme. You can apply this on any theme whether it’s WordPress, Blogger, Joomla or any other blog or CMS scripts where you have the options to fill any ads codes in text area via your admin dashboard. Something like WordPress text widget.

For an example; you have a blog or website and you’re an affiliate with some advertising program. You get the ads codes and after that you paste it somewhere on your website ads space. Most of us didn’t realize it’s not simply ‘copy and paste’ and then you’re done. It’s not like that at all. If you view the ads space, you or your site visitor going to notice the ads color doesn’t match your website theme colors. It’s like looking at a racing car with all sorts of ads campaign sticking to it.

What am I getting at?. To see my point, look at the sample image below (Before & After):

ads before - Match text ads color with website template using EyeDropper tool ads after - Match text ads color with website template using EyeDropper tool
Before After

Before, the text ads and the template background doesn’t match at all. The ads is using light color and the theme is using dark color. We want to match the colors so people won’t even notice there’s an advertisement inside the widget. After we have match the colors then you will see the difference.

Okay, I’ll show you how then. All you need is just one simple tool. No worries, it’s only 295Kb in size and no installations needed. The size may varies to different version though. You don’t need to do the print screen routine or opening up the image editing app. It’s called EyeDropper by Nova Vizija d.o.o. at I’m really comfortable with version 4.0 because it’s compatible with Windows 7 or XP. Download the file and extract the program to your desktop.

Once you clicked the program, there is a small window following your mouse pointer around. Next, go to your website and point anywhere on your website and look for colors you wanted to match with your text ads such as fonts, div border, background, etc. Copy the color codes and use it to style your text ads. It’s that simple.

There is another tool called Instant Eyedropper but I find it such a hassle to click and hold the left mouse button. I prefer the EyeDropper better. You just use which one suited best for you.

The EyeDropper is extremely useful not for styling your text ads only but any other designing needs like image graphic editing, creating web template layout, blog themes, etc.

You can download it here:



3be765f3839eb2031da28bdf07a07de2 - Match text ads color with website template using EyeDropper tool