Outer Shadow
Use d-bs-{n} to add an outer box shadow to an element.
<div class="d-p-200 d-bar-400 d-bgc-primary d-bs-sm">d-bs-sm</div>
<div class="d-p-200 d-bar-400 d-bgc-primary d-bs-md">d-bs-md</div>
<div class="d-p-200 d-bar-400 d-bgc-primary d-bs-lg">d-bs-lg</div>
<div class="d-p-200 d-bar-400 d-bgc-primary d-bs-xl">d-bs-xl</div>
<div class="d-p-200 d-bar-400 d-bgc-primary d-bs-card">d-bs-card</div>
No Shadow
Use d-bs-none to remove a box shadow to an element.
<div class="d-p-200 d-bar-400 d-bgc-primary d-bs-none">.d-bs-none</div>
Use h:d-bs-{n} to change an element's :hover state box shadow.
<dt-button kind="unstyled" class="d-p-200 d-bar-400 d-bgc-primary h:d-bs-md">Hover over me</dt-button>
Use f:d-bs-{n} to change an element's :focus and :focus-within state box shadow.
<dt-button kind="unstyled" class="d-p-200 d-bar-400 d-bgc-primary f:d-bs-md">Focus me</dt-button>
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="d-p-200 d-bar-400 d-bgc-primary fv:d-bs-md">Keyboard focus me</dt-button>