Systema

Appearance

Hover Preview ​

A collapsible panel below the preview scroll area showing live details about the swatch, surface, or container under the cursor. The panel is split into two 50/50 halves, each a 35fr 65fr label/value grid:

Left half:

  • Swatch row — entity name + column index + contrast ratio (e.g. Containers 3 4.52), falling back to c-N {ratio} when the swatch carries no entity name. Level/frame/overlay wrappers show their own label verbatim plus the ratio.
  • Hex row — uppercase #RRGGBB plus the rgb(r,g,b) form.
  • Clamp row — "Same hex as neighbour — contrast ceiling reached" or "No contrast ceiling reached".

Right half:

  • Factors row — effective coF (contrast) and chF (chroma) for the hovered cell.
  • State row — condition name (Enabled / Selected / …) plus interaction name (Hover / Press / Idle / … — composite interactive cells update this live as you mouse over them).
  • Chroma row — "Chroma clipped N% — gamut limit at this tone" or "Full source chroma preserved".

There is no separate "Entity" row — the originating entity name is folded into the Swatch identity row. On pointer-leave (exiting the preview) every value shows a placeholder em-dash (—). While the pointer is inside the preview over empty space, the footer reports the seed background colour — the Hex row shows the seed hex while the other rows show dashes.

The info updates via event delegation — a single pointermove handler on the scroll container walks up from the target to the nearest [data-preview-hover] element, avoiding React listeners on thousands of individual swatches. Pointer-leave (exiting the preview) clears to null (placeholder dashes); hovering empty space inside the preview falls back to reporting the seed background colour.

Toggle: Settings → Editor Display → Preview footer. Hotkey: ⌥2 (Alt+2). State persisted as showPreviewFooterPanel in LayoutState.

Mode Hover Preview ​

Hovering a mode in the Mode dropdown (or the Mode / Fixed segmented toggle) live-previews the entire canvas with that mode's seed colour and direction, without committing the selection. The preview reverts on pointer-leave or when the dropdown closes, leaving the active mode unchanged.