---
title: Accessibility
status: wip
---

## Screen reader support

It may be appropriate to add additional content that supports users of screen reader software.

The `.sta-sr-only` class can be used to hide content on screen but still make it accessible to screen readers and those navigating using a keyboard. The `.sta-sr-only--focus-visible` modifier can be added to show the element when it receives keyboard focus.

## Focus states

All elements that can receive a focus state should clearly indicate this. The pattern library reserves the use of the orange colour `#ffb400` to signify interaction with an element. Focus is typically indicated by an outline while activating an element also then receives an orange background. The use of underline for text elements can be used alongside the colour changes.