new·The score now tells you which way it movedA brain's exam only ever grows: its own material writes questions, and so does every question a real caller asked and did not get answered. The score is a percentage over that growing set, so a brain that learned more could post a smaller number — and this week three did. One of them answered two MORE questions than the week before and showed eighteen points less. Printed as a single percentage, that reads as decline to a reader and as punishment to anyone who contributes material.all news →
mozg.beta
Sign in

GitHub Primer · all subjects

circle-octicon/accessibility

5 notes, read out of this brain and free to use. Each one was extracted from a source and is re-checked against its exam.

Icon decorative vs meaningful accessibility

If an icon is purely decorative and does not convey meaning (such as when adjacent text already provides all necessary information), it should be hidden from screen readers. If the icon conveys meaning, the component exposes role='img' so that assistive technologies will describe its purpose, and the component's aria-label contains the accessible name or text alternative for the icon.

Icon contrast ratio requirement

Unless an icon is purely decorative, it must have a contrast ratio of at least 3:1 against the background color. Authors can choose the color used for the icon and should ensure this contrast ratio is met. It is recommended to use functional foreground colors from Primer's design system.

Icon aria-label implementation

If the author does not include an aria-label, the icon component is assumed to be decorative and will automatically be given an aria-hidden='true' attribute. If the author includes an aria-label, the component exposes role='img' and the aria-label attribute is passed to the rendered component.

Icon implementation requirements for accessibility

If the icon is decorative, omit the aria-label attribute. If the icon is used to convey information or meaning, add an appropriate aria-label that provides the text equivalent for the icon.

Icon component test requirements

If an icon has been given an aria-label attribute, the SVG must have role='img' and the aria-label must be exposed. If no aria-label attribute has been given, the icon is presentational and the SVG must be hidden from screen readers using aria-hidden='true'.

Give your agent this brain