Add BlueSky Icon to Squarespace

BlueSky is a social media network that’s growing in popularity and if you have an account, you might want to link to it from your Squarespace website.

Thanks to its infancy, Squarespace doesn’t pull through the BlueSky logo if you add it to your social icons like it does for platforms such as Facebook and Instagram.

While we wait for Squarespace to introduce this, there is a way of adding the logo using custom code.

Watch the video

Check out the YouTube video below 👇

Head to Pages > Website Tools > Custom CSS and add the following code to your custom CSS box:

a[href*="bsky.app"] svg {

display: none;

}

a[href*="bsky.app"] {

background-repeat: no-repeat;

background-size: 100%;

background-position: center;

background-image: url("https://static1.squarespace.com/static/678b8eab13c4c85ce6a1fec5/t/678b908c85102620d10590bc/1737199756244/Untitled+design.png");

} 

This will add a white BlueSky icon, if you want it a different color you’ll need to find a different version and replace the link in the code.

Hopefully it won’t be long until Squarespace introduces the BlueSky logo, but this is a great placeholder hack for the time being.

---

📩 Join the inner circle to get exclusive code updates

---

Your designer

I'm Sam, an award-winning Squarespace web designer. I have worked with every type of business, building platforms for solo entrepreneurs through to multi-million dollar corporations. If you want to discuss a potential project, you can email on sam@bycrawford.com or get in touch with me here. Alternatively, you can book in a free 15-minute consultation call here.

---

Want more?