The Toggle Background options in Divi let you customize the background colors for open and closed toggles in your Accordion or Toggle module. This enhances user interaction by visually differentiating the states.
Where to Find the Toggle Background Options
Open the Module Settings: Click the gear icon or directly on the Toggle or Accordion module you want to customize.
Go to the Design Tab: Within the Design tab, locate the Toggle option group.
Toggle Background Customization Settings
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.
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.