Neumorphism Generator
CSS Neumorphism Generation Tool
Create soft-UI (neumorphic) elements visually and copy the CSS code.
About Neumorphism
Neumorphism, also called soft UI, is a design style that makes elements look like they are extruded from or pressed into the background. It uses two box shadows of the same element: one lighter shadow and one darker shadow placed on opposite sides to simulate a single light source.
The key to a convincing neumorphic effect is that the element shares the same background color as its container. The light and dark shadows are simply slightly lighter and darker variants of that color. Concave and convex variations add a subtle gradient, while the pressed style uses inset shadows for an indented look.
