Design

Glassmorphism Generator

Generate glassmorphism CSS effects.

Blur 16px

Opacity 0.20

CSS

background: rgba(255,255,255,0.2);
backdrop-filter: blur(16px);
-webkit-backdrop-filter: blur(16px);
border: 1px solid rgba(255,255,255,0.2);
border-radius: 16px;

About Glassmorphism Generator

Generate glassmorphism CSS effects.

How to use

1Open the Glassmorphism Generator above and fill in any required inputs.
2Adjust options if the tool exposes them , changes preview live.
3Copy or download the result using the buttons provided.

Tips

Everything runs locally in your browser , your data never leaves the device.
Bookmark this page for quick access next time.

Related tools

Color Palette Generator

Generate beautiful color palettes.

55k

Color Shades Generator

Generate shades and tints of any color.

41k

Gradient Generator

Create CSS gradients visually.

76k

Border Radius Generator

Generate CSS border-radius values.

61k

Box Shadow Generator

Generate CSS box-shadow values.

41k

Neumorphism Generator

Generate neumorphism CSS shadows.

88k