Motion & accessibility

Fast motion token, focus ring and reduced-motion contract for accessible 12PM interactions.

Foundation

Motion stays short and functional; accessibility rules override decorative timing or color-balance preferences.

Guidance

Fast state change140ms--12pm-sys-motion-duration-fast

Standard easingcubic-bezier(0.2, 0, 0, 1)--12pm-sys-motion-easing-standard

Focus ring3px / 2px offset--12pm-sys-focus-ring-width / --12pm-sys-focus-ring-offset

Reduced motionDisable non-essential motionprefers-reduced-motion

Focus must remain visible, labels must stay readable, and non-essential motion must respect prefers-reduced-motion.