Glassmorphism
Glassmorphism Generator
Create beautiful frosted glass effects for modern UI design
Preview
Glass Card
This is a preview of the glassmorphism effect. Adjust the controls to customize.
Button
Secondary
Controls
Tailwind Classes
backdrop-blur-lg bg-white/25 rounded-xl border border-white/18CSS Code
1/* Glassmorphism Effect */2background: rgba(255, 255, 255, 0.25);3backdrop-filter: blur(16px) saturate(180%);4-webkit-backdrop-filter: blur(16px) saturate(180%);5border-radius: 16px;6border: 1px solid rgba(255, 255, 255, 0.18);