Neumorphic CSS Generator

Create soft 3D neumorphism UI elements with real-time preview and instant CSS export.

⚙️ Controls

200px
20px
20px
40px
0.15
Neumorphic
Generated CSS
.neumorphic-div {
  width: 200px;
  height: 200px;
  border-radius: 20px;
  background: #e0e5ec;
  box-shadow: 20px 20px 40px rgb(186, 191, 198), -20px -20px 40px rgb(255, 255, 255);
  color: #4a5568;
  display: flex;
  align-items: center;
  justify-content: center;
}