How to change the color of the social media icons in a Squarespace mobile menu

This tutorial is specifically for the latest version of Squarespace, known as 7.1, and won't work for older versions of Squarespace. For more information, visit https://insidethesquare.co/themes

The social media icons in the mobile menu of Squarespace are designed to be the same color as the links in your menu, but with a little custom CSS we can change that! Use the code below to change the color to suit your brand style. To learn more about the types of colors you can use in code, check out this article: insidethesquare.co/colors

Here is the code:

Be sure to update the word red in the code below to the color you want your icons to be:

.header-menu-actions .icon svg {fill: red}

insidethesquare


Grab my collection of custom codes for Squarespace: 
→ insidethesquare.co/css

Learn CSS for Squarespace in my free class:
→ insidethesquare.co/learn

https://insidethesquare.co
Previous
Previous

How to use a custom font for the mobile menu in Squarespace 7.1

Next
Next

How To Use Google Icons in Squarespace