Examples#

While shadows on components are disabled by default in Bootstrap and can be enabled via $enable-shadows, you can also quickly add or remove a shadow with our box-shadow utility classes. Includes support for .shadow-none and three default sizes (which have associated variables to match).

{ { < example class="overflow-hidden" }}

{ {< /example >} }

CSS#

Sass variables#

{ { < scss-docs name="box-shadow-variables" file="scss/_variables.scss" }}

Sass utilities API#

Shadow utilities are declared in our utilities API in scss/_utilities.scss. Learn how to use the utilities API.

{ { < scss-docs name="utils-shadow" file="scss/_utilities.scss" }}