Shadows

Agregue o elimine sombras a los elementos con las utilidades de sombra de cuadro.

Ejemplos

Si bien las sombras en los componentes están deshabilitadas de forma predeterminada en Bootstrap y se pueden habilitar a través de $enable-shadows , también puede agregar o eliminar rápidamente una sombra con nuestras box-shadow clases de utilidad. Incluye soporte para .shadow-none y tres tamaños predeterminados (que tienen variables asociadas para coincidir).

Sin sombra
Pequeña sombra
Sombra regular
Sombra mediana
Sombra más grande

<div class="shadow-none p-3 mb-5 bg-light rounded">Sin sombra</div>
<div class="shadow-sm p-3 mb-5 bg-white rounded">Sombra pequeña</div>
<div class="shadow p-3 mb-5 bg-white rounded">Sombra regular</div>
<div class="shadow-md p-3 mb-5 bg-white rounded">Sombra mediana</div>
<div class="shadow-lg p-3 mb-5 bg-white rounded">Sombra más grande</div>

Sombra para imagen
<div class="faded-drop-shadow p-3 mb-5 bg-light rounded">sombra para imagen</div>