Qué es el Glassmorfismo, nueva tendencia de diseño web en 2022

Os detallamos qué es el glassmorfismo en diseño web y cómo aplicarlo con CSS y en Adobe XD con un vídeo muy ilustrativo

El Glassmorfismo o glassmorphism es una tendencia de estos últimos años en interfaces de UI/UX que se está consolidando en 2022 en el terreno web.

Qué es el Glassmorfismo

El glassmorfismo es un efecto visual imitando un cristal traslúcido en los diseños de UI/UX para aplicaciones web y otro tipo de sistemas como ventanas de apps en MacOS o iOS, Windows u otro sistema operativo.

Es una tendencia UI que se comenzó a implementar en el 2020, pero que hasta este año no se ha consolidado para diseño de aplicaciones web.

Características principales del glassmorfismo

  • Efecto de cristal translúcido para ventanas o elementos de texto tipo cards.
  • Formas y fondos tras los elementos translúcidos con colores llamativos para potenciar el efecto glassmórfico.
  • Bordes redondeados de los elementos creados con técnicas de Glassmorfismo.
  • Mejora en la experiencia de usuario (UX) para captar su atención y no perder de vista elementos importantes de la interfaz.
  • Simulación de efecto tridimensional en páginas web por el acoplamiento de diferentes capas en diferentes niveles de visualización.

Creación de efecto glassmórfico en CSS

Siempre podemos currarnos un código CSS3 que podamos usar en cualquier elemento de nuestra página web, pero si tenemos una aplicación web que ya nos lo haga y sea compatible con la mayoría de navegadores, pues casi mejor, ¿no?

Aquí podéis generar un efecto de Glasmorfismo en un minuto y medio en CSS para cualquier elemento de vuestro site.

VÍDEO: Qué es el Glassmorfismo y cómo aplicarlo en Adobe XD

¿Qué os parece el Glassmorfismo?

¿Aplicacaríais este efecto tan chulo a vuestra página web? Opinad y preguntarme en los comentarios de esta página.

Aquí tenéis un claro ejemplo de que esta tendencia se está consolidando con muchos ejemplos de Glassmorphism en Dribble.

5/5 - (1 voto)
- Publicidad -

Te puede interesar...

Dejar respuesta

Please enter your comment!
Please enter your name here

DEWEBLOPING!https://dewebloping.com/
Blog de Marketing Digital donde os enseñaremos a hacer crecer vuestro negocio desde una perspectiva sencilla y fácil de implementar. ¡Aprende con nosotros!

Conecta con DEWEBLOPING!

337FansMe gusta
2,989SeguidoresSeguir
19suscriptoresSuscribirte
- Publicidad -

Artículos interesantes

- Publicidad -