The third hard rule of the DF4 system, made operational. One curve, four timing tokens, four primitives, three sanctioned ambient surfaces. Every animation across the family — parent site, every product company, every product app — composes from this and only this.
There is one curve. There is one reveal distance. The timing family has five members, picked by what is animating — never by taste.
Every animation in the system is one of these four. If you reach for a fifth, the answer is to compose two of these — not invent.
An entry, revealed.
Fade up 8px over --t-base.
--t-base; --t-slow for hero, --t-quick for toast.animation-delay by 40ms per child, capped at 8.--t-instant (120ms). Opacity-only — no translate.--t-march. Linear, infinite. The signal is "this surface is live" — ownership.--t-march. The signal is ownership — this is a DF4 surface.When a user opts out, animations don't simply shorten — they rebuild themselves so the user learns the same thing without translation. Slide becomes fade. Stagger collapses. Ambient surfaces freeze on the most recent state.
The explicit list. If a design proposal uses anything below, it is rejected — not refined. The doctrine wins.
Before any DF4 surface ships with motion, every box below is checked. If one is unchecked, the surface ships static and the motion lands in a follow-up.
var(--ease) (or sanctioned linear).--t-instant / --t-quick / --t-base / --t-slow / --t-march.var(--reveal) (8px) or 0.transform: scale() on hover, anywhere.animation: ... infinite outside telemetry / ticker / logomark.prefers-reduced-motion: reduce tested — page tells the same story without movement.