Glassmorphism Generator

Design frosted glass UI cards with live preview. Click CSS to copy.

Glass Card

This is a glassmorphism UI element with frosted backdrop blur.

Background Color

Opacity 15%

Blur 12px

Border Opacity 30%

Border Radius 16px

Shadow Opacity 20%

Shadow Blur 30px

CSS Output (click to copy)

Browser Support:
backdrop-filter: Chrome 76+, Safari 9+, Edge 79+, Firefox 103+
-webkit-backdrop-filter needed for Safari