Home/Color & Design
🔘

Neumorphism

Generate soft UI shadow effects. This tool runs 100% locally in your browser.

Advertisement
Ad Slot: tool-top
border-radius: 50px;
background: #e0e0e0;
box-shadow: 20px 20px 40px rgb(199, 199, 199), -20px -20px 40px rgb(249, 249, 249);
Advertisement
Ad Slot: tool-bottom

What is Neumorphism?

Generate Soft UI (Neumorphism) CSS code. Create elements that appear to be extruded from the background using light and dark shadows. A popular design trend for clean, minimal interfaces.

When to Use This Tool

  • 1Soft buttons
  • 2Input fields
  • 3Toggle switches

Examples

Input
Distance: 20px, Intensity: High
Result
box-shadow: 20px 20px 60px #bebebe, -20px -20px 60px #ffffff;

Frequently Asked Questions

Does it work on dark mode?

Yes, just pick a dark base color and the shadows will adjust to create the extruded look.

Privacy & Security

Privacy is our priority. Unlike many other online tools, ToolsHub doesn't upload your data to any server. Whether you're processing sensitive text, calculating financial data, or generating passwords, everything stays in your browser.