About:

The Colourphill AODA tool helps you select and test colour palettes for AODA compliance. Colour contrast ratios are calculated dynamically as you enter or select colours to give you a "go/no-go" on the colour combinations.

Instructions:

To change colours:

• Click on the colour's name in the column header to enter or change the name.
• Click on the colour sample block in the column header to change it.
• Colours can be selected from a palette, or entered as RGB and HEX values.
• AODA contrast ratios in the main chart are updated automatically as you try different colours.
• A green ✔ indicates the foreground (row) and background (column) colour combination passes the AODA requirements.
• A red ✗ means the colour combination does not pass AODA.
• Click on any result cell to see samples of the colour combinations.

To add or remove colours:

• Click on the green "+" or red "–" buttons at the top of a column to add or delete colours in the chart.

WCAG 2.0 Definitions

Level 1: AA-Large requires a minimum contrast ratio of 3:1 and large text (14pt-bold/18pt-regular and larger).
Level 2: AA requires a contrast ratio of 4.5:1 or higher for all sizes of text.
Level 3: AAA-Large requires a minimum contrast ratio of 4.5:1 and large text (14pt-bold/18pt-regular and larger).
Level 4: AAA requires a contrast ratio of 7:1 or higher for all sizes of text.

Large text is defined as 14 point bold (typically 18.66px) or larger, or 18 point regular (typically 24px) or larger.

W3C Web Content Accessibility Guidelines (WCAG) 2.0