F5.13.2Token namingdesign

Name stops with index numbers, not semantic words, so meaning does not drift across versions

Aliases: scale indices · 100 through 900 · semantic stop names

What it is

Version one names the mid blue hover and the next darker stop pressed. Version two wants a lighter hover: someone tints hover, someone adds hoverSubtle, and old components still point at a stop that is no longer hover. Stops on the scale should be called by an index (100, 200, 500). “Hover” is a component role, bound to a stop, not written into the stop’s name. Otherwise the name survives a version and the meaning has already moved.

Why it happens

An index is a tick on a ruler; it does not promise a use. A role is a use, and uses change with interaction. Writing the use into the stop name claims that this stop will always do that job. When interaction changes, either the value changes (everything that referenced the name moves, including what should not) or a new name is added (the table bloats, the old name becomes a trap). Both are semantic drift.

Roles still need names — onPrimary, pressedFill — at the pairing and component layer, pointing at an index. The scale layer stays dumb: it only says where on the light–dark walk you are. Dumb names stay still; clever names expire.

Where it stops holding

  • A three-stop functional set that will never grow can live as default / hover / pressed, but a fourth stop will cost a rename. Small tables may take the bet; large ones should not.
  • External docs may say “500 is roughly the default fill” as a mnemonic. A mnemonic is not an identifier.
  • Renaming the index itself (old 500 becomes 400) is also a break. Stable numbers still need release discipline; they are not magic.

Applying it

  • Scale identifiers are numbers or equally neutral indices. State names live only on the reference layer.
  • Do not put hover, error, muted in a scale-stop name.
  • If a stop’s use must change in a migration, change references, not the apparent position behind the name.
  • How to check: search scale identifiers in code. If you can read interaction semantics off them, they are not split yet; you should only be able to read position.

Related

  • Same group: F5.13.1 How many stops a scale has trades fine control against upkeep · F5.13.3 Algorithmic ramps still need hand correction where a stop jumps · F5.13.4 Once a scale is shipped, changing how many stops it has ripples through every referencing component
  • Nearby: F5.09 Perceptual requirements of palettes · F5.02 Semantic colour
  • Search terms: token naming · colour scale index · semantic drift

Cards in the same group

Quick Actions

Share

Share this page

ios_share

https://hci.top/en/handbook/F5.13.2