SyntaxStudy
Sign Up
Home CSS Reference box-shadow

box-shadow

property CSS3

Adds shadow effects around an element. Supports multiple comma-separated shadows.

Syntax

box-shadow: x-offset y-offset blur spread color;

Example

css
/* Simple shadow */
.card { box-shadow: 0 2px 4px rgba(0,0,0,0.1); }

/* Larger, softer shadow */
.elevated { box-shadow: 0 10px 30px rgba(0,0,0,0.15); }

/* Inset shadow */
.pressed { box-shadow: inset 0 2px 4px rgba(0,0,0,0.2); }

/* Multiple shadows */
.multi {
    box-shadow:
        0 1px 3px rgba(0,0,0,0.12),
        0 1px 2px rgba(0,0,0,0.24);
}