Shadows
立体感と奥行きのためのボックスシャドウ定義
シャドウトークンは、コンポーネントに一貫した奥行き表現を提供します。
スケール
shadows.innerinset 0 2px 4px 0 rgb(0 0 0 / 0.05)
shadows.xs0 1px 2px 0 rgb(0 0 0 / 0.05)
shadows.sm0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1)
shadows.md0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1)
shadows.lg0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1)
shadows.xl0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1)
shadows.2xl0 25px 50px -12px rgb(0 0 0 / 0.25)
shadows.raised0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1)
shadows.overlay0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1)
shadows.floating0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1)