Back to all tools

Neumorphism Generator

Generate soft UI neumorphic effects

Live Preview

Shape Style

Properties

CSS Code

background: #e0e5ec;
border-radius: 50px;
box-shadow: 10px 10px 20px #babfc6,
       -10px -10px 20px #ffffff;

Neumorphism Tips

  • • Works best with muted, soft colors
  • • Background color must match surrounding area
  • • Flat: raised appearance
  • • Concave: pressed inward effect
  • • Convex: popping out effect
  • • Avoid on small elements (needs space to breathe)

Enjoying this tool?

Support us to keep building free tools!

Secure payment via Stripe • No account required