Shadows

Shadows are a crucial part of our design system, providing depth, hierarchy, and visual feedback. They help users understand the relationship between elements and create a sense of layering in the interface.

buttonShadowLightInputs, forms, and secondary buttons
xsItems that sit directly on top of the canvas; does not include the inset white border like buttonShadowLight
smCards and UI elements that hover or sit above the canvas
mdMenus and popovers
lgModals and drawers
buttonShadowPrimary and themed buttons
darkPopoverAction bars, tooltips, and toasts
some text
fadeDownSticky headers with fade effect
some text
fadeUpContent overlays with white background