Box Shadows

Outer Shadow #

Use d-bs-{n} to add an outer box shadow to an element.

<div class="d-bs-sm">...</div>
<div class="d-bs-md">...</div>
<div class="d-bs-lg">...</div>
<div class="d-bs-xl">...</div>
<div class="d-bs-card">...</div>

No Shadow #

Use d-bs-none to remove a box shadow to an element.

<div class="d-bs-none">...</div>

Hover #

Use h:d-bs-{n} to change an element's :hover state box shadow.

<dt-button kind="unstyled" class="h:d-bs-md">Hover over me</dt-button>

Focus #

Use f:d-bs-{n} to change an element's :focus and :focus-within state box shadow.

<dt-button kind="unstyled" class="f:d-bs-md">Focus me</dt-button>

Focus Visible #

Use fv:d-bs-{n} to change an element's :focus-visible state box shadow [only when focused by keyboard].

<dt-button kind="unstyled" class="fv:d-bs-md">Keyboard focus me</dt-button>

Classes #