How to create curved collage card corners in Squarespace

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

Using a simple border-radius code, we can curve the edges of a collage image card in Squarespace.

You can also do the same thing for an overlap title, and this tutorial will teach you how!

Here are the codes: You can adjust the border-radius with any value, but I recommend using PX or % depending on the look you are going for.

This code will curve the corners of this collage card where the text is displayed.

.design-layout-collage .image-card {border-radius: 15px}

This code is for the overlap title background color. All that we changed here is the selector; adjust that border-radius value to suit your own site style.

.design-layout-overlap .image-title * {border-radius: 15px}