CSS Box Shadow Generator

CSS Box Shadow Generator is a free online tool for generating CSS box shadows in any color and size. CSS generator helps you quickly design box-shadow CSS styles for your projects. It comes with easy-to-use options, and the results are live.

Box Shadow Properties

Horizontal

Vertical

Blur

Spread

Inset

Color

Shadow 0

Box Shadow

Presets

All Bootstrap Colorful Directional Fluent UI Inset Layered Material Design Primer Tailwind CSS Trendy UI

Element Properties

Width

Height

Radius

Color

Box Shadow CSS

box-shadow: 0px 19px 38px 0px rgba(0,0,0,0.3);

Element CSS

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

Box Shadow Property Tips

CSS box-shadow property applies one or multiple shadows to an HTML element. It is CSS3 property and supported by all major browsers. You can create amazing styles of box shadows by using our Box Shadow Generator.

Box Shadow CSS Syntax

box-shadow: none|h-offset v-offset blur spread color |inset|initial|inherit;