Skip to content
UIGrammer
EN 中文

Anti-pattern · Motion · Medium

Instant 0ms State Change

An instant 0ms state change is a state switch with no transition at all, so the interface gives the user no confirmation that anything happened.

The tell

Interactive states — hover, active, checked, selected — changing with no transition.

Why it happens

Transitions are often added last, and hover gets them while active, checked and selected states are forgotten. Zero duration is also what you get from a CSS reset that strips transitions.

The rule

Every visible state change gets 100-200ms. Nothing changes instantly.

  1. Audit hover, active, focus, checked and selected — each needs a transition.
  2. Use 100-150ms for colour and opacity, 200ms where position changes.
  3. Keep disabled and loading states instant only when there is nothing to show.

What is a Instant 0ms State Change?

A button that jumps from default to active with no transition reads as broken, because nothing connects your input to the result. State changes need 100-200ms — long enough to see, short enough not to wait. The same applies to toggles, checkboxes and tab indicators. Zero milliseconds is not "snappy"; it is unacknowledged.

Fix prompt

Paste this after your existing prompt to strip the pattern from the result.