Divi Global Colors

Create and update global colors across your website. If a color swatch is updated in one place, it will be updated site wide.

Goran Cajic avatar
Written by Goran Cajic
Updated over a week ago

Global Colors for Divi is a new dynamic color system that allows you to create and control colors across your entire website. Now you can build your own dynamic color palette of global colors. When you change a global color, all elements using that color are updated. That means you control your entire website's scheme from a single location while using the builder, adding and managing colors as you see fit.

Build Your Own Dynamic Color Palette Of Global Colors

When you adjust a color setting in Divi, you will notice a new Global tab next to existing Saved and Recent color palettes. Opening the global tab will reveal your global color palette, allowing you to manage and apply global colors. Click the plus icon to add a new global color to your palette, or click the gear icon to manage existing colors.

Clicking on a global color will apply that color to your element. You can tell if a color setting has a global color applied by looking at the shape of the color swatch. Global colors are signified by their unique droplet shape. Global colors are different than static saved colors because their color values are dynamic and linked to all elements that use them. If you change a global color, all elements using that color across your entire website will change

Instantly Update Your Entire Website's Color Scheme

Once your website is using global colors, you can adjust your website's color scheme in just a few clicks. Global colors can be used for anything: backgrounds, buttons, text, and anything else on your page. Not only can you add new global colors

you can also edit existing global when an existing global color is updated, all elements using that global are too. A Divi website using global colors can have its entire color scheme changed in just a few moments. That's the beauty of Divi's global color system.

Pro Tip: Convert Static Colors to Global Colors

Starting off a new website using global colors is a great time-saver, but it's also easy to update your existing website to use global colors. You can right-click on any existing static color and choose the "Convert To Global" option. This will automatically add the color to your global color palette and apply the global color to the active color setting.


โ€‹

Next, you can use Divi's Find & Replace system to replace your static colors with global colors in one fell swoop. Once your page has been converted to global Colors, you can change the entire page's color scheme using the global color palette.

Did this answer your question?