How to add a drop shadow to a shape in Squarespace

This tutorial was recorded in Squarespace 7.1 and will not work on legacy sites built on version 7. For more information, visit insidethesquare.co/themes

If you've been looking to add a touch of visual flair to your shapes, you're in for a treat!

In this tutorial, we'll be diving into the world of Squarespace design to show you how to add a shadow to a shape block, giving your website that extra pop of depth and dimension.

With just a few simple steps, you'll be able to create eye-catching designs that captivate your visitors and make your website truly unique.

Ready to level up your Squarespace design skills? Let's dive in!

/* simple drop shadow */
.sqs-block-shape .sqs-shape{
filter:drop-shadow(5px 5px 5px #333)
}

Want to learn more about shadows? Check out this article on creating custom shadows with CSS

Adding a shadow to a shape block is a fantastic way to elevate your Squarespace website design. With just a few easy steps, you can create stunning visual effects that add depth and dimension to your shapes, making them truly stand out on your website.

Whether you're a seasoned Squarespace pro or just starting out, this customization is sure to add that extra wow factor to your designs. The next time you log into your Squarespace account, follow the steps in this tutorial, and start creating eye-catching shapes with stunning shadows.

Get ready to impress your visitors and take your website to the next level. And most importantly, have fun with your Squarespace website! 😉