The Tech Zone

Creating a reliable color system has always been one of the harder parts of web design. You start with a primary brand color, then manually build lighter values, darker values, muted variations, and transparent colors for backgrounds, borders, shadows, buttons, and hover states. The result often works at first, but it becomes harder to manage as the site grows. Divi 5 changes that with the new Color Palette Variable Generator . Instead of building every color manually, you can start with one primary color and generate a connected color system using Divi 5’s relative HSL color system. The generator creates reusable color variables inside the Variable Manager, so your colors are not just saved as static swatches. They become part of your site’s design system. When the base color changes, related colors can update with it, helping your palette stay consistent across modules, presets, and pages. In this post, we’ll walk through what the Color Palette Variable Generator...

Styling a Contact Form 7 form to match your website used to mean writing custom CSS, chasing the right selectors, and checking every field again on mobile. Even when the CSS worked, the form often still felt separate from the rest of the page. That matters because forms are conversion points. When they look disconnected from your design system, they can make the whole experience feel less polished. Divi 5 brings Contact Form 7 forms back into that system. With the Contact Form 7 Styler module, you can display forms you already built with Contact Form 7 and style them directly inside the Divi 5 Visual Builder. This post walks through the full styling process, including inputs, labels, placeholder text, buttons, messages, focus states, checkboxes, radios, and reusable presets. What Is The Contact Form 7 Styler Module In Divi 5? The Contact Form 7 Styler module lets you display existing Contact Form 7 forms inside Divi and style them like native Divi elements. You still create and...