> ## Documentation Index
> Fetch the complete documentation index at: https://makeswift-sasha-eng-8460-create-a-guide-for-troubleshooting.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# Shadows

> Boxes can have shadows to give them a more real-world, dimensional feel. Add shadows by clicking the “+” in the “Shadows” panel located in the sidebar.

Here are the following options for shadows:

* Type: drop or inner shadow
* Color
* Direction
* Distance: how far the shadow is from its element
* Blur: the softness of the shadow
* Spread: when blur is set to “0”, a larger size will act like a solid border

<Frame>
  <img width="300" src="https://mintlify.s3.us-west-1.amazonaws.com/makeswift-sasha-eng-8460-create-a-guide-for-troubleshooting/images/property-panels/shadow-1.png" />
</Frame>

An element can have multiple shadows which can be layered and sorted,
allowing you to add more realistic shadows or create unique effects.

<Frame>
  ![Applying shadows to cards](https://mintlify.s3.us-west-1.amazonaws.com/makeswift-sasha-eng-8460-create-a-guide-for-troubleshooting/images/property-panels/shadow-3.png)
</Frame>

## Examples

You can change the color and angle of your shadow to add a glowing effect to a specific element.

<Frame>![Shadow angle and color](https://mintlify.s3.us-west-1.amazonaws.com/makeswift-sasha-eng-8460-create-a-guide-for-troubleshooting/images/property-panels/shadow-2.gif)</Frame>

## Pro tips

Avoid importing assets with shadows included in the original file, as this can be added in Makeswift.

Another tip is to lower the color opacity and use a higher blur to create softer, more realistic shadows.