Glassmorphism CSS Generator

Create the popular "frosted glass" effect for your UI. Adjust the sliders and copy the code.

Controls

Blur Intensity (10px)

Transparency (50%)

Glass Color

Preview

Generated CSS

.glass-card {
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  background-color: rgba(255, 255, 255, 0.5);
  border-radius: 10px;
  border: 1px solid rgba(255, 255, 255, 0.18);
}