Claymorphism Generator

Generate 3D, fluffy, clay-style UI elements. Combine inner shadows, rounded corners, and depth for a playful, modern aesthetic. Copy the CSS instantly.

Depth: 20

Radius: 40

Base Color

background: #3b82f6;
border-radius: 40px;
box-shadow: inset -10px -10px 20px 0px rgba(0,0,0,0.2), inset 10px 10px 20px 0px rgba(255,255,255,0.4), 10px 10px 20px 0px rgba(0,0,0,0.1);

BUTTON

About Claymorphism Generator

This Claymorphism Generator tool helps designers and developers streamline their workflow. Perfect for creating modern, accessible, and beautiful user interfaces.

Why use this tool?

Free and runs entirely in your browser.
Instant preview and code export.
No installation required.

Related Tools

Color Picker

Pick & Convert Colors

Gradient Generator

Make CSS Gradients

Contrast Checker

Check Accessibility