Operable · Level A · 2.3.1
Three Flashes or Below Threshold
Nothing on a page should flash more than three times in any one-second period, unless the flash is small and dim enough to fall under a defined brightness/area threshold — because rapid flashing, especially saturated red flashing, can trigger seizures in people with photosensitive epilepsy.
- Seizure / vestibular
How to recognize it
Look for rapidly flashing content: a strobing animation, a warning banner that flashes on and off fast, an ad or GIF cycling between bright and dark frames quickly. If it flashes more than three times per second and covers a large enough portion of the screen, it's a candidate failure regardless of intent — this isn't about whether the flashing was decorative or accidental, it's purely about the flash rate and brightness. Red flashing gets extra scrutiny since saturated red-to-dark transitions are especially likely to trigger seizures. The consequence of getting this wrong is uniquely severe compared to most accessibility failures: it can cause an actual physical seizure, not just a usability obstacle.
How to fix it
Simplest fix: don't build anything that flashes faster than three times per second. If a flashing effect is genuinely wanted, keep it below the defined thresholds — small enough in on-screen area and low enough in relative luminance change — or slow it down below three flashes per second entirely. When in doubt, there's no reason to risk it: a slower transition or a static state change (fading, rather than flashing) achieves most of the same visual attention-getting effect without the seizure risk.
Example
Avoid
@keyframes strobe {
0%, 100% { background: white; }
50% { background: red; }
}
.alert { animation: strobe 0.2s infinite; }
/* flashes 5 times per second across a large area */Prefer
@keyframes fade-attention {
0%, 100% { opacity: 1; }
50% { opacity: 0.6; }
}
.alert { animation: fade-attention 2s infinite; }
/* slow, low-contrast pulse, well under the flash threshold */