Glassmorphism Generator

Create frosted glass effects with CSS output

Glass Card

Frosted glass effect

Background

Tint color

#FFFFFF

Blur12px

Background opacity20%

Saturation150%

Border width1px

Border opacity30%

Border radius16px

CSS output

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

Related Tools

Neumorphism Generator

Design soft UI elements with shadows

Color & Design

Box Shadow Generator

Visual CSS box-shadow builder with multiple layers

Color & Design

CSS Gradient Generator

Build linear, radial, and conic gradients with visual stops

Color & Design