How to Change the Background color of Divi Toggle Module Title and Icon

By default Divi Toggle Module didn’t have any style for Toggle open view. It’s look very plain like the below image.

We can add a little CSS to add Background color to the Toggle title and make it stand alone from rest of the content.

/* Toggle open background color */
/* Remove all padding in toggle open view*/
	padding: 0 !important;
/* Remove default toggle top padding*/
	padding-top: 0 !important;
/* Change title color, background color and add padding */
.et_pb_toggle_open .et_pb_toggle_title, .et_pb_toggle_open h5.et_pb_toggle_title {
    color: #fff;
    padding: 10px 20px;
background-color: #2eaef0;
/* change icon color and position */
.et_pb_toggle_open .et_pb_toggle_title:before {
    content: "\e04f";
    color: #fff !important;
    right: 5px !important;
/* add padding to toggle content */
.et_pb_toggle_content {
    padding: 20px;

Copy above CSS code in your Divi Theme Option or custom Code module and see the result. Your resulting page should look like the below image.

Thanks, Happy coding…… 🙂


I'm a freelance Wordpress Front-end Developer, work from my home office. Mostly do my freelance work on Upwork. I'm a TOP RATED freelancer with over 11K+ Work Hours. Specialize in HTML5, CSS3, SCSS, JavaScript, jQuery, Ajax, ES6, Bootstrap, PHP, MySQL, Wordpress, Woocommorce and Custom Wordpress Theme and Plugin Development

Leave a Reply

Close Menu