Images are (obviously) and important part of your site design – and how you incorporate them into your site can make a big difference. If you have a Squarespace site, they offer you a bunch of different options – so this is how to use different Squarespace image styles: how to add them to your site, and how to style them.

Written Instructions for How to Use Different Squarespace Image Styles:

How to select your image style type:

All you need to get started is a photo! Go ahead and add an image block to your site. (For the basics – how to add different elements to a Squarespace page, you can view this post).

Next, in the image settings window, select the Design tab.

Once on the Design tab, you’ll see a dropdown with different image styles. In the image above, you can see that it is set on Collage.

Different style options on the page

You can change some of the style settings for each image type on the page.

You can switch whether the text is on the left or right of the image.

You can also change the shape of the image by rounding the corners of the original or selecting the Shape tab to make the image into a circle or arch.

In the image above, adding a number where you see “0” by “Corner Radius” will round the corners of the original image. You can also change the toggle above that section from “Original” to “Shape” to change the image into a circle or other offered option.

How to change fonts and colors

This is where referring to the video can be more helpful. When looking to change the fonts or colors of your image block. You will need to save the page and navigate to the Site Styles section.

This is located under Design, selected from the Main Menu.

In 7.0: Once you open up Site Styles, simply select the image block on the page and it will open up all of the image block settings.

In 7.1: You will see an option for Image Blocks open up on the righthand of your screen. If you select this, it will give you an option to edit the fonts and proportions for all of the image block types.

To edit the colors, you will select Colors on the righthand menu (not Image Blocks!). When you pick Colors, you will see a tab open up on the page to tell you what color palette is being used. Select that option in your righthand menu (refer to the video if this is confusing!). Once you are on this page, then you can select the image block on the page to jump to its color settings.

Resources mentioned in the video:

Squarespace ➡️ https://www.kcocreative.com/squarespace

Best of luck! Xx, Kara

---

Ready for more?

Be sure to check out and subscribe to my YouTube channel. You can also view SkillShare courses (and a free two-week trial) here.

Affiliate links! I only promote services that I have used myself, regardless of whether I have an affiliate account with them, and using affiliate links when available helps me to continue to provide useful information at no cost to my viewers/readers/peeps. Thank you 🥰