Posts

The Beauty Of Divi 5’s Gradient Variables

Image
Good design tools do more than add new settings. They change how you think about the decisions you make. Gradients are a perfect example. In older workflows, a gradient often lived wherever you built it: one section background, one button, one hero heading, one CTA. If the brand direction changed later, you had to remember where that gradient was used and update each instance by hand. Gradient Variables in Divi 5 change that. Instead of treating a gradient as a one-off value, you can save it as part of your site’s design system and reuse it wherever gradients are supported. That is where the beauty of the feature becomes clear. A gradient can start as one reusable source, show up across backgrounds, buttons, and text fills, and still remain connected to the same value inside the Variable Manager. In this post, we’ll look at what Gradient Variables are, how they fit into Divi 5 ’s design system, how to create them, and how to use them across a site without rebuilding the same visual ...

10 Best Variable Fonts For Web Design (Now In Divi 5)

Image
Have you ever used a variable font before? A traditional font family gives you a fixed set of styles: maybe Light, Regular, Medium, and Bold. If you want something between Regular and Bold, you usually need another font file, and if that exact weight does not exist, you compromise. Variable font support in Divi 5 changes that. A single variable font can contain a range of adjustable design axes, such as weight, width, slant, optical size, and sometimes more experimental controls like casualness, softness, grade, or monospace. That gives you much more control over how typography feels across a website. Instead of forcing an H2 into 400 or 700, you can use a value like 535 if that balances better with your body text. Instead of swapping fonts for a compressed headline, you can adjust width. Instead of using the same display detail at every size, you can adjust optical size. Below are ten strong variable fonts you can use in Divi 5 , what each one lets you adjust, and where each one f...

Everything You Need To Know About Workspaces In Divi 5

Image
The Divi 5 Visual Builder is highly customizable. You can open and close panels, dock them to either side of the screen, float them over the canvas, resize them, group them into tabs, choose which top-bar icons appear, and switch between light and dark modes. That flexibility is useful, but it also creates a small problem: the setup that works best for one task is not always the setup you want for another. A layout-heavy build might need the Layers and Inspector panels open. A writing session might need a cleaner canvas. A smaller screen might need fewer panels competing for space. Divi 5 Workspaces solve that by letting you save complete builder setups and switch between them whenever you need. Instead of rearranging the interface by hand every time your task changes, you can save one workspace for your default build flow, another for content editing, another for responsive checks, and another for focused work. In this post, we’ll look at what Workspaces save, how they’re organiz...