Generador de CSS Glassmorphism

 (ui.glass)
7 puntos por xguru 2021-08-29 | 2 comentarios | Compartir por WhatsApp

  • Tendencia de diseño de UI usada en macOS BigSur / Windows 11

  • Muestra el fondo del elemento superior como una forma difuminada de la imagen/color/patrón que está debajo

→ uso de backdrop-filter: blur()

  • Permite definir imagen/color/gradient de fondo y ajustar el valor de blur, la transparencia y la saturación

Lecturas relacionadas

2 comentarios

 
galadbran 2021-08-29

Me pareció raro porque por más que cambiara los valores de blur y saturation, no cambiaba nada; pero en Edge sí funciona bien y en Firefox no... jaja
 
joyfui 2021-08-29

Yo también uso Firefox, así que me preguntaba cuál era la diferencia, y resulta que Firefox todavía no lo tenía habilitado por defecto...

https://developer.mozilla.org/ko/docs/Web/CSS/backdrop-filter

Parece que funciona si cambias la configuración de about:config.