Neumorphism Generator
Create neumorphic (soft UI) CSS with live controls for size, radius, distance, blur and shape. Copy the CSS instantly — runs entirely in your browser.
CSS
.neumorphic {
border-radius: 40px;
background: #e0e0e0;
box-shadow: 12px 12px 24px #bebebe, -12px -12px 24px #e5e5e5;
}Advertisement
About this tool
Create neumorphic (soft UI) CSS with dual light and dark shadows and flat, concave, convex or pressed shapes, all tuned with live sliders.
Common use cases
- Design soft, extruded buttons and cards
- Match a same-colour, low-contrast UI style
- Copy the box-shadow and background CSS