Glassmorphism Generator

Build glass-effect UI cards and copy the CSS instantly.

Glass Card

Your content here

Blur12px

Background opacity15%

Saturation100%

Border opacity20%

Border radius16px

Glass color

#FFFFFF

CSS

background: rgba(255, 255, 255, 0.15);
backdrop-filter: blur(12px) saturate(100%);
-webkit-backdrop-filter: blur(12px) saturate(100%);
border: 1px solid rgba(255, 255, 255, 0.20);
border-radius: 16px;