The New Gradient Editor in Divi 5: When Gradients Help and When They Look Cheap

Affiliate disclosure: this article contains an affiliate link. If you buy Divi through it, we may earn a commission at no extra cost to you.

Divi 5 rebuilt how gradients work. Every gradient option now lives in one gradient picker panel that behaves the same everywhere a gradient can be set, gradients can be stored as reusable gradient variables, and — new in Divi 5 — gradients can fill text, not just backgrounds. The tools are powerful. Whether the result looks premium or cheap is entirely about restraint.

What changed in Divi 5's gradient system

Elegant Themes consolidated gradient controls into a single picker panel that works identically in the Background option group, in the new Text Effects settings, and inside the Variables manager. Three pieces are worth knowing:

• One gradient picker. Build a gradient once, the same way, wherever you need it.
• Gradient variables. A new variable type. Define a gradient once in the Variables manager (Gradients category → Add Global Gradient), use it across the site, and editing the variable updates every place it appears. This is the single best habit for keeping gradients consistent.
• Text effects. Gradients can now fill text, alongside new text-stroke and image-fill settings. The Text Effects group appears in the font settings of Text, Heading, and Title elements, and you can fill letters with a gradient, an image, or make them transparent.

When gradients help

• Subtle depth on backgrounds. A gentle two-stop gradient between two close brand colors gives a section quiet dimension a flat fill cannot — without shouting.
• One accent headline. A gradient on a single hero word or a section heading draws the eye exactly where you want it. One per view, not every heading.
• Layered background interest. Background layers let you stack a soft gradient over a base color or image for texture, which reads as considered design when the contrast is gentle.
• Buttons and small UI accents. A restrained gradient on a primary CTA can lift it off the page.

When gradients look cheap

• The overloaded hero. A full-bleed rainbow or high-contrast gradient behind a hero is the fastest way to date a site. Heroes usually want a clean color or photo, with the gradient as a subtle layer at most.
• Clashing, far-apart colors. A gradient between two unrelated hues (hot pink to lime) reads as a default template, not a brand. Keep stops within the same family or a deliberate complementary pair.
• Gradient on body text. Gradient fills hurt readability at paragraph size; reserve them for short, large display text.
• Gradients on everything. Used on every heading, button, and panel, the effect stops being special and starts looking busy.

The discipline that keeps it tasteful

Define your gradients as gradient variables and pull from that small set everywhere. This does two things: it keeps the whole site coherent, and it forces you to commit to a handful of good gradients instead of improvising a new one per section. If you can only use the gradients you saved, you naturally use fewer — and that restraint is what separates a premium look from a cheap one.

FAQ

Can I reuse the same gradient across a whole Divi site?

Yes. Create a gradient variable (Variables manager → Gradients → Add Global Gradient) and apply it anywhere; editing the variable updates every use.

Can Divi 5 fill text with a gradient?

Yes, via the Text Effects group in Text, Heading, and Title elements — gradient fill, image fill, transparent text, and text stroke are all there.

How many gradients should a page use?

Few. A couple of saved gradient variables used sparingly looks intentional; a different gradient in every section looks templated.

Bottom line

Divi 5's unified gradient picker, gradient variables, and text effects give you real control — use it for subtle background depth and the occasional accent heading, save your gradients as variables for consistency, and keep heroes and body text clean. Restraint is the whole game.

Get Divi 5

Sources and further reading