Guide d'utilisation
Le glassmorphism repose sur backdrop-filter: blur() appliqué à un fond semi-transparent, complété d'une fine bordure claire. Il nécessite un arrière-plan coloré pour être visible.
- Pensez au préfixe
-webkit-backdrop-filterpour Safari. - Une transparence entre 0.15 et 0.35 donne le meilleur effet.
FAQ
Pourquoi mon effet de verre est invisible ?
backdrop-filter ne se voit que s'il y a un contenu coloré ou une image derrière l'élément. Sur fond uni de même couleur, l'effet disparaît.
Est-ce compatible avec tous les navigateurs ?
Oui sur les versions récentes de Chrome, Edge, Firefox et Safari (avec le préfixe -webkit-). Prévoyez un fallback de couleur pour les anciens navigateurs.