Contrast Companion

What is this tool?

This tool helps you find colours that have sufficient contrast when paired with your existing palette. Simply input your current colour set, and the tool will identify complementary colours that meet accessibility standards across your entire palette.

Input Colours

Enter hex colour codes (one per line or comma separated):

Enter 6-character hex colour codes (with or without # prefix)

Upload a CSV or JSON file:

CSV format: One colour per line or comma-separated

JSON format: {"paletteName": ["#colour1", "#colour2", ...]}

Contrast Ratio

Select your required contrast ratio:

Equal to or greater than 3:1 (minimum for UI components and graphical objects)

Equal to or greater than 4.5:1 (minimum level for regular text at WCAG AA)

Equal to or greater than 7:1 (enhanced level for regular text - WCAG AAA)

Contrast Companion

What is this tool?

Colour Preview:

Matching Colours

Similar Colours

Contrast Details