Change header social icon colors

This only applies for the header two layout in the premium theme.

We’ve added a bunch of extra color settings to Vogue Premium allowing you to change the header background colors and font colors, and while the social icons take on the same color as the header font, you might still need to change the social icons colors to better suit your design.



This would be done by adding custom CSS to your site. This is done by either creating a child theme and adding your own CSS to the stylesheet, or adding the following custom CSS to Customize -> Additional CSS in the WordPress Customizer.

Custom CSS to style the social icon colors.

/* Change the social icon background color */
.header-social .header-social-icon {
    background-color: #4a4a4a;

/* Change the social icon font color */
.header-social .header-social-icon {
    color: #FFFFFF;


You can select any colors you want using a color picker.

Please note: You can only use the hex (#) value or the rgba value.


For custom work on the themes we recommend contacting Codeable.