Amazing Box Shadow

Box shadows play an essential role in creating amazing interfaces. Let’s understand how to make fantastic box shadows and make them stand out.

Box Shadow Properties

Inset
Color
Shadow 0
Box Shadow

Presets

AllBootstrapColorfulDirectionalFluent UIInsetLayeredMaterial DesignPrimerTailwind CSSTrendyUI

Element Properties

Color

Box Shadow CSS

box-shadow: 0px 9px 20px 0px rgba(13,38,76,0.19);

Element CSS

.element {
    width: 250px;
    height: 250px;
    background-color: rgba(255, 255, 255, 1);
    color: #000;
    border-radius: 10px;
    box-shadow: 0px 9px 20px 0px rgba(13,38,76,0.19);
  }