About this tool
Design soft-UI neumorphic elements with paired light and dark shadows, adjustable size, distance, intensity and blur, plus a convex or concave look, then copy the CSS. Live in your browser.
Frequently asked questions
Why does neumorphism use two shadows?
One light shadow and one dark shadow on opposite corners imitate a single light source, making the element appear extruded from the background.
What is the difference between convex and concave?
Convex looks raised out of the surface, while concave inverts the gradient and shadows so the element appears pressed into it.