Professional
For a handful of client sites.
$25/yr
Billed yearly.
Paid once, forever.
Native Divi 5 Module
Divi Gradient Heading
Gradient headings without writing any CSS.
Why use the Divi Gradient Heading module?
A gradient headline is common in modern web design and awkward in stock Divi: it means custom CSS with background-clip:text, tested per browser, redone every time the copy changes.
Gradient Heading is a normal Divi heading with a two-colour gradient fill built in. Pick linear or radial, set the two colours and where each one starts, and the text renders with the gradient as its fill.
The line beside this is the live module.
What you get out of it
Linear or radialTwo gradient types, each with its own angle or position control.Two colours, two stopsEach colour has its own position along the gradient, from 0 to 100 percent.It can be a linkUse Link turns the whole heading into an anchor, with open-in-new-window and nofollow options.A real heading underneathIt takes the standard heading level and font group, so it behaves like any other Divi heading in the outline.No custom CSSThe gradient is a module setting, not a hand-written background-clip hack.Free, and native on Divi 5It ships in Divi Torque Lite on WordPress.org, built on the Divi 5 engine.
Everything the Divi Gradient Heading module does
Every option below ships in the free plugin.
Gradient type: linear or radialLinear: angle in degreesRadial: position, a 9-value enumPrimary and secondary colourPrimary and secondary stop location, 0-100%Turn the heading into a linkOpen link in a new windowAdd nofollow to the linkStandard heading level and font groupCustom CSS hook for the title
See the Divi Gradient Heading in action
Every headline below is the live module, not an image. This one is the default linear type.
Linear, 90 degrees
Indigo to green, left to right.
Linear at different angles
Angle is a plain number in degrees, so the direction of the gradient is exact.
0 degrees
Bottom to top.
45 degrees
Diagonal.
180 degrees
Right to left.
Radial gradients
Radial takes a position instead of an angle: three rows of left, centre and right, each top, centre or bottom.
Centre centre
The gradient radiates from the middle of the text.
Top left
The gradient radiates from one corner.
Where the colours start and stop
Each colour has its own stop position, so the transition can be pushed to one side instead of splitting evenly.
Compressed stops
Primary stops at 30%, secondary starts there too, for a harder edge between the two colours.
Building one takes about a minute
Three steps, and none of them involve custom CSS.
1Drop in the moduleAdd Gradient Heading to any row. It arrives with a default two-colour gradient already applied.2Write the headingThe Content panel takes the text and, if you want the heading to link somewhere, a URL.3Pick the gradientThe Design tab holds the type, the two colours, and either the angle or the position depending on the type.
Questions people ask first
Short answers, all of them checked against what the module actually does.
Is the Gradient Heading module free?Yes. It ships in Divi Torque Lite on WordPress.org.Does it need Divi 5?It is a native Divi 5 module. A Divi 4 layout using the same module converts across, since it shares the same shortcode.Can I use more than two colours?No. The gradient is exactly two colours, primary and secondary, each with its own stop position.Can the heading link somewhere?Yes. Use Link turns the whole heading into an anchor, with options to open it in a new window and add nofollow.Does it work with any heading level?Yes. It uses the standard Divi heading font group, so the level and typography sit alongside any other heading on the page.Can the gradient animate?No. The gradient is a static fill. There is no motion or hover-triggered colour shift.
Simple, honest pricing
Every plan unlocks all 98 Divi modules on unlimited websites. One licence covers every site you build.
4.7★ from 116 reviews on WordPress.org
Studio
Room to grow your client roster.
$49/yr
Billed yearly.
Paid once, forever.
Business
Built for agencies running many sites.
$59/yr
Billed yearly.
Paid once, forever.
Unlimited
Every site you will ever build.
$99/yr
Billed yearly.
Paid once, forever.
Pro + Saddle Pro
Two lifetime licences. One payment.
$499once
Paid once, forever.
- 30-day money-back guarantee
- Lifetime honored forever, in writing
- Secure checkout