Disclaimer: I am an ElegantTheme’s affiliate and some of the links in the post are referral links. However, I personally use the Divi Theme and think it’s a great product that truly makes building many types of websites faster and easier.
This post is about how easily you can set default color options using the Divi Theme for your WordPress website.
Did you know Divi provides a way to set a default color palette, so you can consistently use your most important colors whenever you need them? It’s one of the first settings on Divi’s theme options page. From here, you can set 8 default colors and then quickly have the ability to use them anywhere throughout the rest of your site. Pretty cool, right?
- Choose 8 default colors
- Create consistent brand identity
- Quickly re-use colors throughout your entire website
Setting Default Colors in Divi Theme Options
Every client and brand has their own colors. So, every company’s website uses a color palette. Using a collection of branded colors creates a consistent look and feel across your business’s site. Colors quickly and easily allow visitors to recognize that a web page is part of a larger website and not a standalone piece of random content. Consistent use of colors visually helps people know they’re on your website no matter which page they’ve landed on or browsed to.
Alternative Color Management
There are several alternative ways to manage color palettes across a website, but there’s not really a way that’s easy for clients or no-code/non-technical people to use. You could establish CSS classes that assign background-color and colors for fonts, borders, etc. within a website’s code. You could give your clients a list of HEX or RGB values of their colors and try to teach them how to edit stylesheets and create inline CSS. You could even hardcode colors into blocks or components, so everything always looks nice, but that’s not very customizable.
At best, the WordPress theme or block you’re using has a select menu with pre-determined options or a color-picker where you can select any color under the rainbow. At worst, you’re asking clients to work in code.
The Divi Theme for WordPress changes all that.
Customizing Elements with Default Colors
With Divi, setting default colors in theme options makes it incredibly simple to re-use the same exact colors anywhere on your website. No matter if you’re customizing text, borders, or backgrounds you can quickly and easily choose your colors from the default color palette you’ve set up. If you want to veer off to another spot in the rainbow you can, but even then there is no need to guess at a 6-character HEX (#FF0000) value or a 255-number-range RBG code (RGB(255, 0 0)) to keep your branding on point because Divi has a standard color-picker feature too. Divi gives you full control over picking colors for your website’s design with no coding experience required.
See? The same set of default colors you set in theme options appears when you edit part of your website’s design. Clicking on the color with the droplet icon opens a full color-picker in case you need something different. Although in my experience, most small business and corporate brand websites can live happily within 8 custom colors.
Need help choosing a color palette? Explore pre-built complementary color palettes and color inspiration at COLOURLovers.com.
Interested in Trying Divi?
If you’re a small business owner, website developer, or digital marketing agency interested in simplifying your website development process then I highly recommend checking out Divi for WordPress.