Skip to main content Design tokens Components Style utilities
Skip to table of contents

    Shadows

    Shadows are used to give elements the appearance of being raised off the page. Use them with the box-shadow property. These are especially useful for menus, popovers and dialogs.

    TokenExample
    --pc-shadow-xs
    --pc-shadow-s
    --pc-shadow-m
    --pc-shadow-l
    --pc-shadow-xl