Entity mark — accessibility
Keyboard
- Not focusable and not interactive. When it leads a row or sits in a chip, that host is the control.
ARIA
- The mark is
aria-hidden="true": the tone and glyph are a compressed rendering of a type that the surrounding text already states — the section it sits in, the byline, or the type word in a header. Announcing "green briefcase" before "Fotovoltaika — Fialka Group" would be noise. titlecarries the record name (or the type label when no name is given), which surfaces on hover for a sighted mouse user. It is not a substitute for the name being present as text.- Consequence: a mark must be accompanied by the record name in text. On its own it is invisible to a screen reader, by design.
- The person and company branches inherit the avatar's rules — see
avatar.
Focus
- Nothing focusable, so no focus ring. The row, chip or button around it keeps the foundation ring from
ds.css.
Contrast
Computed from packages/ui/src/tokens/tokens.css:
- The glyph is white on a solid
--ic-*ground. Measured against the seven tones, the white drawing clears 3:1 on blue, purple, green, rose and grey; amber and lime sit lower, which is why they carry the lightest glyph load in the vocabulary (a calendar and a car, not fine detail). - The mark is decoration, not information: the type is always available as text nearby, so a reader who cannot resolve the glyph loses nothing.
- Tone is never the only carrier — two types share a tone by design (a world), and the glyph separates them.
Known limits
- Seven tones for twenty-seven types means a tone identifies a world, never a single type. Anyone reading colour alone will land on the group, not the record.
- The glyph is small: at
inline16 the drawing is 12 px, which is a shape, not a diagram. Types whose glyphs differ only in fine detail should not sit in the same world. - Colour is not announced and cannot be perceived by a user who cannot distinguish the tones — again, nothing is lost, because the tone carries no information the text does not.
Source: docs/avatar/entity-mark.a11y.md · GitLab