How to style images with image borders on SquareSpace

Oct 10

Styling your images will make your Squarespace site so unique! Here is a CSS trick just for you.

Get the Code!

Add this code in your squarespace editor menu, click Design > Custom CSS

/*Block image inline Border*/
.design-layout-inline .image-block-wrapper {
 background-image:
    linear-gradient(
      to right, 
      #C89595,
      #DDBEBE, 
    );
  padding: 30px,
}

If you prefer a half border, use this code instead:

/*Block image inline Border*/
.design-layout-inline .image-block-wrapper {
 background-image:
    linear-gradient(
      to right, 
      #C89595,
      #DDBEBE 60%, 
      white 0%,
    );
  padding: 30px,
}

Featured

Sep 27, 2024

Hello, I’m Aurelie

Sep 27, 2024

Web strategist, designer, mom of three, and creative entrepreneur, passionate about helping health & wellness professionals grow their businesses online.

WORK WITH ME

Sep 27, 2024