Accessibility

Last updated on
21 September 2022

Claro aims to provide an accessible and easy to use default theme for Drupal’s administration interface. To do so it follows several guidelines and conforms with the WCAG 2.1 AA.

Some of the key considerations used as a basis of our designs are:

  • Usage of a large enough base font size (16px) to have a legible interface.

  • Usage of spacing through a careful implementation of padding and margins on several UI elements to have a proper scan-ability.

  • Form element sizes meet the proposed AA standards, which makes them much easier for touch devices in general.

  • All links are underlined by default, both on light and dark backgrounds.

Highlighted features

Focus state

An important element of the Claro design is the focus styles that help draw users attention to where they are by using consistent focus areas and visual clues across UI elements.

Claro focus styles examples

WCAG color contrast AA conformance

Colors have been checked so the UI elements such as default text color over backgrounds, labels or titles conform with the minimum contrast requirements to ensure WCAG AA compliance.

High Contrast (forced colors mode)

The UI has been tested against high contrast modes such as the Windows High Contrast theme, Firefox and Chrome high contrast modes.

Help improve this page

Page status: No known problems

You can: