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 some custom CSS by either creating a child theme and adding your own CSS to the stylesheet, or simply adding a custom CSS plugin and adding the following code to the plugin.

Here is some custom CSS to help you 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.