Design

Generatore glassmorphism

Crea l'effetto vetro smerigliato in CSS con sfocatura, trasparenza, tinta e anteprima in tempo reale Funziona sul dispositivo — niente viene caricato online, niente viene memorizzato.

Sfocatura12px

Trasparenza20%

Saturazione120%

Raggio del bordo16px

Spessore del bordo1px

Opacità del bordo40%

Colore della tinta

#ffffff

Sfondo

Anteprima

Glassmorphism

Output CSS

/* Glassmorphism */
background: rgba(255, 255, 255, 0.20);
border-radius: 16px;
box-shadow: 0 8px 32px 0 rgba(0, 0, 0, 0.18);
-webkit-backdrop-filter: blur(12px) saturate(120%);
backdrop-filter: blur(12px) saturate(120%);
border: 1px solid rgba(255, 255, 255, 0.40);

/* Fallback for browsers without backdrop-filter support */
@supports not ((-webkit-backdrop-filter: blur(2px)) or (backdrop-filter: blur(2px))) {
  background: rgba(255, 255, 255, 0.60);
}

Correlati

Generatore di clip-path CSSDesign Editor di curve cubic-bezierDesign Generatore di blob SVGDesign

Informazioni su Generatore glassmorphism

Crea l'effetto vetro smerigliato in CSS con sfocatura, trasparenza, tinta e anteprima in tempo reale

Generatore glassmorphism è uno strumento gratuito della categoria Design e grafica su BrowseryTools. Funziona interamente nel browser: quello che gli dai viene elaborato sul tuo dispositivo e non viene mai caricato su un server, non ci sono registrazione, pubblicità né filigrane, e una volta caricata la pagina continua a funzionare anche senza connessione.