Just getting started with Squarespace CSS? Awesome! 😍 I want to teach you the basics – grab my free Getting Started Guide here 👉 https://insidethesquare.co/learn
—
This quick tutorial will show you how to add what is called a “Drop shadow” to images on your site. A quick video, I walk you through how to change the color of the shadow and how to turn it into a hover effect, prompting it to show when a cursor is over the image. Watch the quick tutorial and when you are ready, grab those copy + paste CSS codes below!
This custom CSS code will add a drop shadow to on page images:
.image-block {
filter: drop-shadow(5px 5px 8px #000000);
}
This CSS code will add a drop shadow to images on a hover:
.image-block:hover {
filter: drop-shadow(5px 5px 8px #000000);
}
—
▸▸▸ Ready for more codes?
The codes in this tutorial are just the beginning of all the cool things you can do with Custom CSS! When you’re ready to dive in and start customizing, you can use codes from my CSS Cheat Sheet. It has over 30 pages of code snippets and pro tips to help you get started. Download your copy at https://InsideTheSquare.co/css
—
Need some help? Visit https://insidethesquare.co/code-help to see my current support options.
—
The term “Squarespace” is a trademark of Squarespace, Inc. This content is not affiliated with Squarespace, Inc. I just really love their platform ♥
—
#squarespace #squarespacecss #howto #customizesquarespace #css #squarespacetricks #squarespacehacks #squarespacetips
