Question 1

What is neumorphism?

Accepted Answer

Neumorphism (or new skeuomorphism) is a UI design style that uses soft, extruded shadows on a uniform background color to make elements look like they are pressed into or raised out of the surface. The background, element and shadows all share the same base hue.

Question 2

How do I use the generated CSS?

Accepted Answer

Click Copy CSS, then paste it into your stylesheet or inline style. You also need to set the same background color on the parent container so the soft shadows blend correctly.

Question 3

What is the difference between flat, pressed and convex neumorphism?

Accepted Answer

Flat (or raised) makes the element look like it sticks out. Pressed (inset) makes it look sunken into the surface. Convex uses a gradient overlay so it looks rounded like a pillow.

Question 4

Does neumorphism work on dark backgrounds?

Accepted Answer

Yes. Set the Background and Element color to a dark shade. The light shadow becomes a lighter dark grey and the dark shadow becomes near-black. The generator computes both shadows automatically from your chosen color.