Glassmorphism Generator

Create beautiful frosted glass UI effects with our free online generator. Fast, easy customization of blur, transparency, colors, and borders to achieve the modern glassmorphism aesthetic. Copy production-ready CSS code instantly for your web projects.

Glass Card

Presets

CSS Code

backdrop-filter: blur(10px);
-webkit-backdrop-filter: blur(10px);
background-color: rgba(255, 255, 255, 0.2);
border-radius: 16px;
border: 1px solid rgba(255, 255, 255, 0.2);
box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);

Blur & Opacity

Blur10px

Opacity20%

Colors

Background Color

Border & Radius

Border Radius16px

Border Width1px

Border Color

Shadow

Enable Shadow

Shadow Blur20px

Shadow Color

Frequently Asked Questions

Related Tools

Box Shadow Generator

Designer

Gradient Generator

Designer

Color Converter

Designer

Border Radius Generator

Designer

Glassmorphism Generator

Presets

CSS Code

Blur & Opacity

Colors

Border & Radius

Shadow

Frequently Asked Questions

Related Tools

Tags