Website Building » Squarespace » How Do I Change the Button Color in Squarespace?

How Do I Change the Button Color in Squarespace?

Last updated on December 12, 2022 @ 6:21 am

There are many ways to change the button color in Squarespace. One way is to use the Custom CSS Editor. To do this, go to Design > Custom CSS and enter the following code:

button {
background-color: #ff0000;
}

This will make all buttons on your Squarespace site red. If you only want to change the color of a specific button, you can add a class or ID to the code like this:

PRO TIP: If you are trying to change the button color in Squarespace, be aware that this is not currently possible. While you can change the color of text buttons, you cannot change the color of image buttons. This is something that Squarespace is working on, but there is no estimated time frame for when this feature will be available. In the meantime, you can use a workaround by adding a custom CSS code block to your site.

.button-class {
background-color: #ff0000;
}

#button-id {
background-color: #ff0000;
}

Another way to change the button color is to use the Block Styles options. To do this, go to the page where the button is located and click on the button. In the Block Styles menu that appears, select Button > Main > Background Color and choose the color you want.

Conclusion: There are two main ways to change the button color in Squarespace – using the Custom CSS Editor or Block Styles. If you want to change the color of all buttons on your site, use Custom CSS. If you only want to change the color of a specific button, use Block Styles.

Dale Leydon

Dale Leydon

Sysadmin turned Javascript developer. Owner of 20+ apps graveyard, and a couple of successful ones.