Multiple layered hard shadows

Author Jesse Breneman Published on July 8, 2021

I was playing around with layering hard shadows recently and kinda like how this looks. I'm not sure where I would use this but I think it could fit in with certain aesthetics.

Check out my box shadow. 👀

css

.hard-box-shadows {
    --hsl: 170, 50%, 50%;
    border: 1px solid hsla(var(--hsl), 0.08);
    border-radius: 0.5rem;
    box-shadow: 0.25rem 0.25rem 0 hsla(var(--hsl), 0.1), 0.5rem 0.5rem 0 hsla(var(--hsl), 0.1),
        0.75rem 0.75rem 0 hsla(var(--hsl), 0.1);
}