The Five Colour Modes And The Text Controls

New here? Not a customer yet?See everything ResultsAiX Accessibility can do, and get it.Get ResultsAiX Accessibility →

Colour and contrast:

One colour mode is active at a time. Press a tile to switch.

  • As designed: the page exactly as you built it.
  • Dark: a dark page. On the ResultsAiX Theme it uses the theme's own designed dark colours. On other themes it flips the page's colours to dark while keeping pictures, videos and embedded frames looking natural. It is in place from the very first moment the page appears, with no flash of the old colours.
  • High contrast: a black background, white text, and links in yellow with an underline. On other themes buttons get yellow text and a yellow outline too. Pictures are left as they are.
  • Low colour: softer, less saturated colour on a warm, calm background, with muted pictures.
  • Black and white: the whole page in shades of grey.

Dark, Low colour and Black and white change the colours of the whole screen without moving anything on it, so your site's sticky header, cookie banner and chat bubble stay exactly where they are. The Accessibility panel keeps its own colours so it stays easy to use.

A theme that paints colours into its own images or fixed backgrounds may only partly change in Dark. High contrast gives the strongest result on any theme.

Text:

  • Text size: a slider from 85 to 200 percent.
  • Line height: from 1.40 to 2.40. The page starts at 1.75.
  • Letter spacing: from 0 to 0.20 em of extra space between letters.
  • Word spacing: from 0 to 0.40 em of extra space between words.
  • Font: As designed, Clear letters (Atkinson Hyperlegible) or Reading font (Lexend). Clear letters is a typeface designed for readers with low vision. Reading font is a typeface designed for reading ease. The font applies across the whole page, apart from icons.
  • Alignment: left, centre or right for the article text. Press the highlighted one again to go back to the page's own alignment.

Every slider shows its live value as it moves.

Where the text controls apply:

Text size, line height, spacing and alignment work on the article text: the main content area the plugin finds on the page, plus the page title. On any theme, text size grows every heading and paragraph from its own size, so a heading stays a heading and a quote is never scaled twice. Menus, sidebars and footers keep their size, so your layout holds together. If the slider does not change your article, set the article selector described in The Reading Tools Tab.

The reading fonts:

Both reading fonts, Atkinson Hyperlegible for Clear letters and Lexend for Reading font, come with the plugin and load from your own site, so choosing one never calls any other service. A visitor's browser only downloads a font once the page uses it, when they pick it or pick a profile that uses it. If a font cannot load, the text falls back to a plain standard font.

The Aa button and Reset:

The Aa button on the reading bar steps the text size up to Larger and Large and then back to Normal, for anyone who does not want to open the panel. The Reset button at the top of the panel clears every option at once.

New here? Not a customer yet?See everything ResultsAiX Accessibility can do, and get it.Get ResultsAiX Accessibility →

Ready to stop reading and start using?

Every plugin documented here works alongside the others, managed from one ResultsAiX Hub.