CSS TOOLS
CSS Glassmorphism Generator.
Build modern frosted glass effects with blur and transparency controls.
Frosted Card
background: rgba(96, 165, 250, 0.25);
backdrop-filter: blur(14px);
-webkit-backdrop-filter: blur(14px);
border: 1px solid rgba(255, 255, 255, 0.40);
Three simple steps
How to use CSS Glassmorphism Generator
1
Set base color
Choose the primary tint color.
2
Tune blur and alpha
Adjust blur, transparency and border opacity.
3
Copy CSS
Use the generated snippet in your UI.