Change the Color of Announcement Bar Close Icon on Squarespace
If you add an announcement bar to your Squarespace website then you’ll notice the bar has text and a close icon, e.g. an X in the corner.
While you can change the color of your announcement bar text natively on Squarespace, you can’t change the color of the exit icon. The exit icon will be the same color as the text.
If you want them to be different then you need to use some simple CSS.
Watch the video
Check out the YouTube video below 👇
Want a framework for designing the perfect homepage?
To change the color of your announcement bar close icon head to Website > Pages > Website Tools > Custom CSS and add the following code to the custom CSS box:
.sqs-announcement-bar-close {
color: black !important;
}
Obviously you can change the color in the code depending on what color you want the icon to be, using either the color name, HEX code or RGB code.
Once you’re happy hit save and you’ll have changed the color of the close icon on your announcement bar. Simple.
Need an expert to build your Squarespace website?
Book a free kick-off call with our team to discuss your project requirements in detail.
