1 · Pick two colours

2 · Palette from a logo

Upload a logo to pull out its main colours. Then use any colour as your text or background and check it.

Result

0: 1 contrast ratio
The quick brown fox
Body text at normal size. Most visitors read pages like this on a phone, in daylight, so weak contrast costs you readers.
Button or link

CSS

Based on the WCAG 2.2 contrast formula. Normal text needs 4.5:1 for AA and 7:1 for AAA. Large text (24 px, or 19 px bold) needs 3:1 and 4.5:1. Icons, borders and form fields need 3:1.

Runs in your browser. Nothing you type or upload is stored or sent.

How it works

Three steps. No signup.

01

Enter two colours

Text and background. Use a hex code or the colour picker.

10 seconds
02

Read the result

See the ratio and pass or fail for normal text, large text and icons.

Instant
03

Fix it or build a palette

Use the nearest passing colour, or upload a logo to find its main colours.

2 minutes
Questions

Colour contrast questions, answered.

Straight answers about contrast and colour. If yours is not here, send it to me directly.

What contrast ratio do I need?

WCAG AA asks for 4.5:1 for normal text and 3:1 for large text and interface parts such as icons and borders. AAA asks for 7:1 and 4.5:1.

What counts as large text?

About 24 px regular, or about 19 px bold, and larger.

Does this make my site legally compliant?

Contrast is only one part of accessibility. Passing here is a good step, not a guarantee of compliance. This is not legal advice.

How does the nearest colour work?

The tool darkens or lightens your text colour in small steps until it reaches the target ratio, so it stays as close to your original as possible.

Is my logo uploaded anywhere?

No. The image is read in your browser to find its main colours and is never sent to a server.

Why are the logo colours slightly different?

Images contain many close shades. The tool groups similar ones and shows the average of each group.

Free tools, plus a free website audit

Want help with the rest of your website?

These tools are free to use. If your site needs more than a quick fix, I design and build custom websites for small businesses, and I offer a free audit that shows you what to fix first.