Backdrop Filter

Definition

Propriété backdrop-filter qui applique des effets graphiques (flou, saturation) à la zone derrière un élément. Crée des effets de verre dépoli (glassmorphism) sans image.

Analogie

Comme une vitre dépolie dans une salle de bain : on voit les formes à travers mais pas les détails.

Exemple de code

.glass-panel {
  background: rgba(255, 255, 255, 0.1);
  backdrop-filter: blur(12px) saturate(180%);
  border: 1px solid rgba(255, 255, 255, 0.2);
}

Cas d'usage

Créer des navbars ou panneaux en glassmorphism qui laissent transparaître le contenu en fond.

Anti-pattern

Termes lies