Beer League Resource Design System

Effects

Effects are Drop Shadows, Inner Shadows and Blur Effects.

CSS Tokens SASS Tokens Style Dictionary Component Types

Shadow Effects

sm

effect-shadow-sm0px 1px 3px rgba(0, 0, 0, .1), 0px 1px 2px -1px rgba(0, 0, 0, .1)

md

effect-shadow-md0px 4px 6px -1px rgba(0, 0, 0, .1), 0px 2px 4px -2px rgba(0, 0, 0, .1)

lg

effect-shadow-lg0px 10px 15px -3px rgba(0, 0, 0, .1), 0px 4px 6px -4px rgba(0, 0, 0, .1)

xl

effect-shadow-xl0px 20px 25px -5px rgba(0, 0, 0, .1), 0px 8px 10px -6px rgba(0, 0, 0, .1)