Saltar al contenido

Generador de Glassmorphism CSS

Crea efectos glassmorphism (cristal esmerilado) con CSS. Ajusta desenfoque, opacidad, color de fondo y sombra. Código CSS listo para copiar. 100% en tu navegador.

Vista previa

Glassmorphism
10px
20%
30%

Código CSS

 

¿Qué es Glassmorphism?

Glassmorphism es una tendencia de diseño que simula el efecto de cristal esmerilado o vidrio translúcido. Se logra combinando backdrop-filter: blur(), fondos semitransparentes, bordes sutiles y sombras. Es popular en interfaces modernas como las de Apple y Microsoft.

Compatibilidad

backdrop-filter es compatible con todos los navegadores modernos (Chrome, Edge, Safari, Firefox). En navegadores más antiguos, el efecto de desenfoque no se mostrará pero el fondo semitransparente seguirá funcionando como fallback.

Privacidad

Todo el procesamiento se ejecuta 100% en tu navegador. No se envían datos a ningún servidor.