CSSAwwwards
+ Submit tool
GeneratorsFree

CSS Shadow Palette Generator

Create layered, cohesive box-shadow systems with perceptual color science.

Visit CSS Shadow Palette Generator
CSS Shadow Palette Generator preview

About this tool

CSS Shadow Palette Generator by Josh W Comeau generates beautiful, layered box-shadow systems grounded in perceptual color science. Choose a hue, adjust elevation and shadow count, and get a full palette of shadows that feel physically plausible — not flat or harsh. Outputs CSS custom properties you can use across your project.

Details

CategoryGenerators
Tags#shadow#box-shadow#elevation#css
Websitewww.joshwcomeau.com/shadow-palette
Added
PricingFree

Share

Share on XLinkedIn

More Generators tools