L’opacité de l’élément vacille de façon irrégulière, comme une lampe défaillante.
Usages
Effets néon et glitch
Ajoute un effet « Flicker » (aussi appelé flickering) sur [où].
L’élément doit rester stable la plupart du temps et baisser d’intensité par brefs à-coups irréguliers, comme un néon défaillant.
Garde un rythme irrégulier plutôt que régulier, évite les flashs rapides à pleine intensité, et arrête-le si l’utilisateur a activé la réduction des animations.
L’élément s’allume par de brefs clignotements d’opacité, comme une enseigne néon défectueuse, avant de rester visible.
Usages
Effets de texte néon et rétro
Ajoute une animation d’entrée « Flicker In » sur [où].
L’élément doit s’allumer et s’éteindre quelques fois à intervalles irréguliers, comme une enseigne néon défectueuse, avant de rester allumé : des flashs nets, sans déplacement.
Joue-la une seule fois, avec peu de flashs et assez lents pour ne pas gêner les personnes sensibles aux lumières clignotantes, et affiche-le allumé en continu si l’utilisateur a activé la réduction des animations (prefers-reduced-motion).
L’élément grossit ou s’estompe doucement, puis revient, de façon répétée.
Usages
Skeleton loaders, indicateurs en direct, CTA
Ajoute un effet « Pulse » (aussi appelé pulsing) sur [où].
L’élément doit gonfler doucement puis revenir selon un rythme lent et régulier : discret, sans rebond.
Fais-le tourner en boucle sans coupure sans décaler la mise en page autour, et arrête-le si l’utilisateur a activé la réduction des animations (prefers-reduced-motion).
Aussi appelée Neon Sign Flicker, Glowing Text
Le texte brille comme un tube néon et clignote ou pulse.
Usages
Thèmes vie nocturne et gaming
Ajoute un effet « Neon Glow Text » (aussi appelé neon sign flicker ou glowing text) sur [où].
Le texte doit briller comme un tube néon, d’une lumière douce et régulière, et de temps en temps s’éteindre brièvement comme une vraie enseigne.
Garde le clignotement occasionnel plutôt que rapide, car les flashs rapides peuvent nuire à certains utilisateurs, et garde la lueur fixe si l’utilisateur a activé la réduction des animations (prefers-reduced-motion).