Skip to main content
All CollectionsDivi 5Options Groups
Understanding the Toggle Background Options in Divi 5
Understanding the Toggle Background Options in Divi 5

Learn how to use the Accordion's Toggle Background option to improve both the aesthetics and usability of your Toggle or Accordion modules.

Updated over a week ago

The Toggle Background options in Divi allow you to customize the background colors for open and closed toggles in your Accordion or Toggle module. These settings help you visually differentiate the toggle states, enhancing user interaction.

Where to Find the Toggle Background Options

  1. Open the Module Settings: Click the gear icon or directly on the Toggle or Accordion module you want to customize.

  2. Go to the Design Tab: Within the Design tab, locate the Toggle option group.

Toggle Background Customization Settings

  1. Open Toggle Background Color: Set the background color for toggles when they are in the open state. Choose from your site's color palette or use the color picker to find a custom color.

  2. Closed Toggle Background Color: Set the background color for toggles when they are in the closed state. Select a color from your site's palette or customize it using the color picker.

Best Practices for Using Toggle Background Options

  • Enhance Visibility: Use contrasting colors for open and closed states to help users easily identify toggle status.

  • Maintain Consistency: Choose colors that align with your site’s overall design and branding.

  • Consider Accessibility: Ensure that background colors provide sufficient contrast with the text for readability.

These background options allow you to improve both the aesthetics and usability of your Toggle or Accordion modules, providing a clear visual cue for interaction.

Did this answer your question?