States

Words

All learned. See them in History.

• Disabled state

  How a control looks when you can't use it yet: grayed out, not clickable.

• Drop zone

  An area where you can drag a file and let go to upload it.

• Empty state

  What a screen shows when there is nothing in it yet, like an empty inbox or a new project.

• Error state

  What a screen shows when something goes wrong, like a failed load or a missing page.

• Hover state

  How something changes when the mouse is over it, like a button getting brighter.

• Optimistic update

  The screen shows the result of your action right away, before the server has confirmed it.

• Preloader

  A full screen shown while a heavy site loads, before you can use it, often with only a logo and a percentage.

• Pressed state

  How a button looks while you are pushing it down.

• Progress bar

  A bar that fills up from left to right to show how much of a task is done.

• Rate-limit message (429)

  What the user sees when the server says "too many requests, slow down" (HTTP status 429).

• Request timeout

  The longest time the page or the server will wait for an answer before giving up.

• Skeleton screen

  While content loads, the page shows gray shapes where the text and pictures will go.

• Spinner

  A small shape that spins or pulses to say "please wait" when you can't tell how long something will take.

• Success state

  What the screen shows after something worked, like a sent form or a finished payment.

• Theme toggle

  A switch that changes every color on the page between a light and a dark theme, and often a "System" option that follows the device.