Effect

Box Shadow

Style syntax for adding shadow effects around an element.

🚧This page is still under construction and some content may not be complete.

Overview [sr-only]

ClassDeclarations
box-shadow:value, / shadow:value,box-shadow: value,
shadow:offset-x|offset-y|colorbox-shadow: offset-x offset-y color
shadow:offset-x|offset-y|blur-radius|colorbox-shadow: offset-x offset-y blur-radius color
shadow:offset-x|offset-y|blur-radius|spread-radius|colorbox-shadow: offset-x offset-y blur-radius spread-radius color
shadow:inset|offset-x|offset-y|colorbox-shadow: inset offset-x offset-y color

Conditionally apply

Apply styles in different states using selectors, media queries, etc.

<div class="box-shadow:1|2|3|blue:hover box-shadow:1|2|3|blue@sm box-shadow:1|2|3|blue@dark box-shadow:1|2|3|blue@print"></div>
PREVIOUS
Backdrop Filter

Style syntax for applying filter effects to the area behind an target element.

NEXT
Filter

Style syntax for applying graphic effects to an element.

MIT License © Aoyue Design LLC.