Plugin Directory

Test out the new Plugin Directory and let us know what you think.

Fourteen Colors

Customize the colors of the Twenty Fourteen Theme, directly within the Customizer.

I tried using Fourteen Colors with a theme other than Twenty Fourteen and ...

Don't. There is a known bug where the plugin may be applied to other themes when live previewing them, but Fourteen Colors will prevent itself from functioning when the current theme is not Twenty Fourteen or a child.

Child Themes

Fourteen Colors is a plugin, not a child theme, because it is primarily programmatic (ie, it would only consist of a functions.php file), and for flexibility.

You can use Fourteen Colors with both Twenty Fourteen and child themes. Be aware that the Fourteen Colors settings are stored with the active theme, so if you switch to a child theme or switch child themes, you'll need to re-set your colors. Child theme compatibility depends on the extent of changes made by the child theme. But child theme developers can hook into Fourteen Colors to extend it to adapt to their changes, allowing the plugin to work seamlessly even if the child theme is significantly different than the parent theme.

Suggested/Recommended Colors

The contrast color option tends to work best with colors that are either grayscale or close to grayscale. Try light or dark grays in conjunction with any accent color if the default black feels too bold.

Accent colors work best when they are intense, fully saturated colors that avoid anything too light or too dark. However, brighter colors such as yellow do work well, as do darker colors such as black, with a good choice of contrast color. If a particular set of colors feels close, but not quite right, try making the accent color more intense and making the contrast color lighter (if it's already light) or darker (if it's already dark) to increase the overall contrast of your site.

Known Issues

Due to the automatic generation of secondary colors, in order to maximize color contrast ratios, undesirable colors may come up in some places. You can override these with custom CSS, and feel free to post in the support forums if you can't figure it out (but search there first).

Please note that if you're having trouble getting the plugin to "work" it is extremely likely that you're doing something wrong. Don't forget that the color options are added to the Customizer.

Supported Colors

All colors are supported except for pure white (#fff), which should technically work but results in a poor user experience due to the lack of contrast, which helps to provide visual hierarchy. Pure black (#000) accent colors are more fully supported, but can also have (less significant) issues with providing proper visual hierarchy.

Requires: 3.8 or higher
Compatible up to: 4.7.2
Last Updated: 3 months ago
Active Installs: 30,000+


4.8 out of 5 stars


Got something to say? Need help?


Not enough data

0 people say it works.
0 people say it's broken.

100,1,1 75,4,3
100,2,2 100,2,2
0,1,0 100,1,1