How to make an Arch Shaped Image in Squarespace (the easy way)
I’ve been seeing archway images everywhere lately! Just check out these Instagram post templates in Canva:
Beautiful, right? And I’ve been seeing arches used more and more in Squarespace designs too:
So, how do you make an arch shaped image in Squarespace?
This used to require custom code, but since Squarespace has rolled out Image Shapes (you may also hear these called image masks) it’s so easy! Here’s how to turn your image blocks into arches and other shapes. This method works for both Squarespace 7.0 and Squarespace 7.1 websites.
1. Add an image block to your website
Click a “+” in any blue insertion point on your page to open the Block Menu. Click on “Image” to load an image block into your Squarespace website.
2. Add an image to the block content
Next, add your image by dropping it into the Content area or clicking the large “+” above “Add an Image.” Want a solid color arch? Just add a .png of a large block of color as your image.
3. Move to the design panel
Open the design panel of the image block and choose Shape and then click Shape (yeah this is weird)
5. Choose the 2:3 aspect ratio and select the arch shape
Depending on the size of your image, you can change how your image falls in the frame. Click back to the Content panel of your image block settings. Look for a tiny outlined circle floating on top of your image. You can drag that tiny circle around to adjust the focal point, which changes what part of your image is in the frame.
Here are some examples of the Squarespace image shapes
I’ve used the Circle image shape throughout my SPICE Squarespace Template as a design element and have had fun trying out all these new shapes. I hope you do too!