Option Group Presets in Divi 5 are reusable style blocks for a specific design option group, like Typography, Background, Borders, Spacing, Buttons, Shadows, or Effects.
You define a style once, save it as a preset, then apply it to any element that supports that group across your entire site.
Unlike the Element Presets, the Option Group Presets are not tied to a single module type, which makes them perfect for building shared patterns like heading styles, button styles, card shadows, and spacing rules.
What Option Group Presets Are
In short, an Option Group Preset is:
A saved style for one option group (for example, Button, Title Text, Border, Spacing, Background).
Reusable across all elements that expose that group (sections, rows, columns, modules).
Globally linked: edit the preset once, and every element using it updates.
Examples:
A Border preset that sets radius, width, and color, used on Blurb, Image, and Text modules.
A Title Text preset used for all H2-style headings inside various modules.
A Button preset used by all modules that contain buttons (Contact Form, Call to Action, Email Optin modules, etc.).
This shifts your thinking from styling individual modules to defining reusable design rules.
Where You Find and Create Option Group Presets
You work with Option Group Presets inside the Visual Builder, directly in each option group.
To create an Option Group Preset:
Open the Visual Builder on any page.
Open the settings modal of an element (a section, row, column, or module) by clicking on it or by clicking the gear
Go to the Design tab and find the option group you want (for example, Border, Button, Title Text, or Spacing, etc.).
Hover the group’s title and click the small Preset icon in the top right.
Click the Add New Preset or New Preset From Current Styles (if the options group already has some options changed) button.
Give it a clear name (for example, Section Heading).
Adjust styles if needed and click the Save Preset button.
⚠︎ Note: Only the styles that are available for a specific options group will be changed. In the example above, a new option group preset is created for the Heading option group of a Text module.
From that point on, this preset appears in the list for that group anywhere on your site.
Applying and Editing Option Group Presets
To apply an Option Group Preset:
Open the element’s settings.
Go to the relevant option group (for example, Heading).
Hover the group title and click the Preset icon.
Choose the preset you want from the dropdown list.
The element now inherits that group’s styling from the preset instead of using a local static configuration.
To edit an Option Group Preset globally:
Open any element that already uses an option group preset.
Hover the option group's title and click the Preset icon.
Select the preset in the list and click the gear icon.
Change the options you need.
Click the Save Preset button.
Divi warns you that this will update all elements using that option group preset across your site.
You can also perform other actions on an option group preset, such as:
Update preset from current static styles
: Update a preset from current styles (pull in overrides you made on one element).Duplicate
: Duplicate a preset as a starting point for a variation.Delete
: Delete presets you no longer need.Set as Default
: Set a preset as the default for that option group.
Using Option Group Presets to Create Design Patterns
Option Group Presets are ideal for turning repeated design decisions into a system.
Typical patterns:
Typography: Presets for H1 - H6, body text, and small labels.
Buttons: Shared button presets applied across multiple modules.
Spacing: Spacing presets for cards, sections, rows (for example, Padding / Section Large", Padding / Card Medium).
Borders & Shadows: Presets for card outlines, soft shadows, and hover shadows.
Effects & Motion: Presets for scroll effects, transforms, or conditions used in multiple places.
Workflow for more maintainable designs:
Design a page or component normally.
Notice repeating decisions (same padding, same heading style, same shadow).
Turn those groups into Option Group Presets instead of repeating the styles manually.
Reuse those presets on other sections, rows, columns, and modules.
When you need to change a pattern (for example, tighten the spacing (padding) or soften shadows), you edit the preset once and let it flow through the site.
Stacked Presets: Layering Option Group Presets
Just like the Element Presets, Divi 5 lets you stack multiple presets on the same options group.
You can think of each Option Group Preset as a small style layer:
One option group preset for Paragraph.
One option group preset for Links.
One option group preset for Ordered List.
One option group preset for Unordered List.
You can then apply all those option group presets to the Text option group of a Text module or any other module that uses the Text option group.
These stacked presets will apply the styles defined in the Text → Paragraph for all paragraphs, the styles defined for the Links in the Text → Link option, which might exist inside a Text module.
How Stacking Order Works
When you stack presets, order matters.
Divi applies presets in the order they’re added.
You can change this by giving a higher/lower value for the Priority option when editing/creating a new Option Group Preset.
If multiple presets set the same option (for example, text color or border radius), the later preset in the stack wins for that option.
⚠︎ Note: All Option Group Prests (out of the box) have the same Priority: 10
Using Option Group Presets Inside Element Presets (Nested Presets)
You can also nest Option Group Presets inside Element Presets. Instead of hard-coding spacing, borders, and shadows inside an Element Preset, you build that Element Preset out of Option Group Presets.
Basic idea:
Create Option Group Presets for your recurring rules:
Spacing: "Section / Vertical Large", "Card / Padding Default".
Borders: "Card / Radius & Stroke".
Shadows: "Card / Soft Shadow".
Typography: "Heading / H2", "Body / Base".
Edit an Element Preset (for example, a Row or Blurb preset).
In each relevant group, choose your existing Option Group Preset instead of manual styles.
Save the Element Preset.
The result:
The Element Preset acts like a component.
Its internal rules (spacing, radius, shadows, typography) all come from Option Group Presets.
If you later change those Option Group Presets, every Element Preset (and every element using them) updates accordingly.
You still can stack extra Option Group Presets on top for context tweaks, without breaking the nested structure.
Practical Examples
Here are some concrete ways to use Option Group Presets for advanced styling in Divi 5.
Global Button System
Create Option Group Presets for Button: "Button / Primary", "Button / Secondary", "Button / Ghost".
Set "Button / Primary" as the default Button preset, so every new module with a button uses it automatically.
For specific modules (like a hero Call to Action), stack an extra option preset to change size or add a special hover effect.
Result: all buttons stay consistent, and you can still layer variations where needed.
Typography System
Create Option Group Presets for "Heading H1–H6", "Body Text", "Meta Text".
Set key presets as defaults so new elements inherit them automatically.
When you adjust a heading preset (font, size, line-height), every heading using that preset updates across the site.
Result: typography changes become a preset edit instead of a page-by-page chore.
Tips for Working with Option Group Presets
To keep your design system clean and easy to maintain:
Keep presets focused
Each Option Group Preset should do one job well (for example, "Card Shadow / Soft", not "Card Everything").Create them early
As soon as you see a style repeated more than once, turn it into a preset instead of copying settings.Use defaults for base styles
Make your core typography, button, and background presets the defaults so new elements start in the right place.Use stacking for context, not basics
Let nested presets and defaults handle the foundations; use stacked presets for context-specific tweaks like “hero version”, “compact version”, or “dark section”.
Once you start using Option Group Presets this way in Divi 5, most of your advanced styling becomes a matter of combining and adjusting presets, not restyling individual modules.






