Kinetic / Experimental

What you see

The perceptual fingerprint, in the order you notice it.

• Type that animates in, marquees, or reacts to the pointer
• Elements that transform on scroll rather than merely appearing
• Transitions that carry meaning — where something came from and went
• Hover states that deform, stretch or magnetise
• A composition that reads as choreographed rather than laid out

Best for

• Portfolios, launches and award-seeking marketing pages
• Products whose differentiator is genuinely dynamic
• Brands with the engineering budget to do motion well

Avoid when

• Content is the point and motion delays reaching it
• The audience skews toward vestibular sensitivity or older devices
• Motion would be the only carrier of a state or a meaning

Accessibility

Where this style tends to fail an audit, and what fixes it.

• `prefers-reduced-motion: reduce` must produce a COMPLETE alternative presentation, not a stripped one: every piece of information conveyed by movement is present, laid out, and legible without any of it.
• Nothing may flash more than three times per second, and no parallax may run under body text.
• Motion never carries state alone. Selection, focus and status each need a static signal that exists whether or not anything moves.