ThemeLab's Blog

Stay up to date with our newest WordPress themes, WordPress plugins, WordPress tutorials, and other announcements.

How to Tweak Your WordPress Website Colors

Last Updated on by

Tweak Theme Colors

There are WordPress frameworks available that allow you to choose the colors your website uses. Most themes however control the color scheme of your website directly through the style.css stylesheet template.

Modifying your color scheme through your stylesheet is not as user-friendly as using a color picker. Therefore, non-technical users may find this method of changing colors on their website very difficult.

There is an interesting plugin called Theme Tweaker that addresses this issue. The plugin can be installed from the official WordPress.org plugin directory. Alternatively, you can install it directly through your WordPress admin area by going to the “Add New” page in your plugin area, searching for “Theme Tweaker” and then clicking the install link.

Install Theme Tweaker

Once activated, Theme Tweaker will search through your current theme and list all of the colors that are listed in your theme stylesheet. This allows you to see the general color scheme of your website. The plugin does not advise you what each color is for. For example, it does not say one color is for your header and another is for your background. It simply lists all colors that are used. It is up to you to test any color changes.

Theme Tweaker Colors

The plugin lists old colors down the left hand side of the settings area. Tweaked colors are shown on the right hand side. This allows you to compare your old and new color schemes easily.

If you click on any color on any tweaked color field, a color picker will pop up. This allows you to choose any color you want. Alternatively, you can enter the hexadecimal color manually in the field (e,g, #ff000 for red).

Theme Tweaker Color Picker

Down the right hand side are six options. The reset color option allows you to reset all colors back to the theme defaults. You can also invert the color scheme and choose black and white, black and white negative, and sepia effect.

White font on a black background is a good color scheme for reading lots of text. This can be achieved using the black and negative option.

Theme Tweaker Negative Example

The last option is random colors. The results of randomising your colors are bizarre to say the least; however do not discard it as a useless option. It is actually a useful way of finding interesting colors that can be used on your theme that you would not have used otherwise.

Theme Tweaker Random Example

By default, any changes you make will be shown to administrators. Your new color scheme will only be shown to visitors once it has been activated.

Theme Tweaker Options

The lite version of Theme Tweaker is free to download from WordPress.org. A pro version is available for $3.95. It allows you to save your color schemes in a CSS file and has the ability to create a child theme for your new color scheme too.

If you are a visual person that prefers to modify your theme using colors rather than code, Theme Tweaker is worth checking out.

About

Noumaan is a professional blogger and a WordPress developer. He likes Star Trek, Quora, and Debian.