How to add coloured stroke around a round image 7.1

Hello,

I have a lot of round images on the site, is there a way to add a coloured strokeborder to the images? I have tried using custom code but the borders are all square?

Can you share link to a page where you use an image?

Yes: 

https://sapphire-orca-wk68.squarespace.com/config/pages

https://sapphire-orca-wk68.squarespace.com/?noredirect

config is url in edit mode

You can click arrow on top right or top left >> real url will appear on browser address bar

Oh sorry..

https://sapphire-orca-wk68.squarespace.com/home

Hopefully this works?

Hi - did that URL work for you?

Hi @Melonmade something like this?

@melody495 yes exactly that! 

How did you do that please?!

31 minutes ago, Melonmade said:

@melody495 yes exactly that! 

Hi @Melonmade, try adding this to your Custom CSS and let me know how it goes

.sqs-block-image div[data-shape-mask="circle"] img {
  border: red solid; // change first value to different colour
  border-radius: 100%;
  border-width: 5px; // change value for thinner/thicker border
  box-sizing: border-box;
}

This will target all your circle images. If you need to target specific images, then you need to add the specific ID for each image.