User guide
The box-shadow property adds one or more shadows: box-shadow: x y blur spread color;. The inset keyword places the shadow inside the element.
- Blur: the higher the value, the softer the shadow.
- Spread: grows or shrinks the shadow.
- Pro tip: stack two shadows for a premium look.
FAQ
How do I create a soft shadow?
Use a large blur with low opacity, e.g. box-shadow: 0 8px 24px rgba(15,23,42,0.08).
Can I stack multiple shadows?
Yes — separate each shadow with a comma in the same box-shadow property.