How to Use Kadence Color Palette: Free Templates Included

Are you in love with Kadence yet? One of the most common questions is what to use for the color palette. The palette in Kadence is very helpful, but very specific. The theme won’t look right, if you don’t get the colors in the right shades in the global Color Palette. Let’s talk about how the palette works in Kadence, so you can take advantage of all the benefits! 

And, see below for a bunch of pretty palettes we created just for you – with all 9 colors needed for the Kadence Global Color Palette. 

Choosing Your Website Color Palette

Readability is important, for your readers and also for SEO. We recommend testing your readability in Web Accessibility Color Contrast Tester.

And make sure your colors cover all three necessary elements in Kadence Palette: Base, Accent, Contrast.

Base, Contrast & Accent Colors in Kadence

Base colors are the background colors in Kadence. There are 3 spots available and the last one should be white, or near white. The other two base colors should compliment your main color scheme. 

Accent colors are the main color ‘splash’ that you’ll find in the Kadence theme. These are the links and call to action buttons. The second accent color is the color a button will change to when ‘hover’ state.

Contrast colors are the text colors. It is important that all 4 contrast colors will show up in high contrast on a white background. 

Creating a new Color Palette in Kadence

Assuming you have Kadence installed, let’s edit the color palettes!

In the WordPress dashboard, navigate to the Appearance Tab > Customizer. Click on “Colors & Fonts”. This will bring up all of the pre-made Kadence color palettes to choose from.

Click on the briefcase icon to add your own palette. You will want all the colors (in hex form ie: #333333) listed in front of you, from Accent to last Base color. 

Click on Import/Export. Copy the top box and paste into the bottom box.

Now, change each hex code, in order to yours. 

Update, then save the customizer edits. Then refresh your page to see the results.

Pre-Made Color Palettes for Kadence Theme

We found a lack of palettes that are specific to these accents, bases and contrasts, as Kadence requires. So we created some for you to choose from. Each photo below includes 2 accent colors, 4 contrast colors and 3 base colors. They are in the correct order on the bottom of each photo for you to enter into your custom palette. 

You can determine the hex# for each color by adding your palette to this free online tool. And hover over each color to get the hex # for it. 

Scroll through the pre-made color palettes below and click on each one to preview it. Once you find one you like, right-click and save it to your computer. You are free to reuse, modify and edit them to your liking. You are not free to distribute them as yours or use them for commercial use. 

Customizing a Custom Global Palette

If you want to make any adjustments to the colors in your selected palette, you can do so under the Customizer > Colors & Fonts > Global Palette > Briefcase Icon. Follow the steps in the “Creating a New Color Palette” heading above. 

I hope these palettes give you a good starting point – are there more colors you’d like to see? Send me a photo and I’ll create a palette for it!

All Pre-Made Kadence Palettes