Background Boxes

A grid of lines or squares whose cells fade or flicker on and off.

Add an "Animated Grid Pattern" background (also called a flickering grid or grid background) to [where].
A faint grid of lines should stay in place while a few scattered cells slowly fade in and out at different times: quiet and subtle, never all at once.
Keep it behind the content without catching clicks, and stop the flicker for users who prefer reduced motion.

A grid of dots pulses or glows in waves.

Add a "Dot Pattern Glow" background (also called a dotted glow background or dot grid) to [where].
A fine grid of dots should stay still while a soft band of glow sweeps slowly across it, lighting the dots it passes: calm and subtle.
Keep the dots faint enough that content on top stays readable, and stop the glow for users who prefer reduced motion.

A bright highlight travels around the border of a card.

Add a "Border Beam" effect (also called a shine border or moving border) to [where].
A short bright highlight should travel around the card's border at an even, unhurried pace, looping without a visible jump.
Keep the card's content and size unchanged by the effect, and stop the beam for users who prefer reduced motion.

A glowing lamp line widens and casts a cone of light onto a heading beneath it.

Add a "Lamp Effect" (also called a lamp glow) to [where].
When the section comes into view, a thin glowing line should widen from the center and cast a soft cone of light down onto the heading below, which fades up into place: slow and smooth.
Play it only once, and for users who prefer reduced motion show the lit heading straight away.