How Do You Spread Shadow in Figma?

When it comes to designing user interfaces, shadows are an important element. They create depth and can help to communicate the hierarchy of elements on a page.

In Figma, shadows can be used to add depth and dimension to any design.

The process of adding shadows in Figma is actually quite simple. First, select the object that you want to add a shadow to.

Then, click the “Effects” tab in the top right corner of the Figma interface. From here, you’ll see several options for customizing how your shadow looks. You can adjust the color, blur and opacity of the shadow as well as its position relative to the object.

In addition to adjusting the appearance of your shadow, you can also use Figma’s “Spread” tool to give your shadow a more realistic look. The Spread tool allows you to spread out your shadow in any direction from its origin point – allowing for more control over how it looks.

To use this tool, simply select your object and then click on the “Spread” button in the top right corner of the interface. You’ll then be able to adjust a slider that will increase or decrease how far away from its origin point your shadow is spread.

Once you have adjusted all of your settings, you can apply your changes by clicking on “Apply” at the bottom right corner of the interface. Your changes will be immediately visible and you will have successfully added a realistic looking shadow to your design.


In conclusion, adding shadows in Figma is easy with their tools for customizing color, blur and opacity as well as their Spread tool for creating realistic looking shadows on objects. With these tools anyone can quickly create beautiful designs with interesting depth within their user interfaces or other projects!