Skip to content
DesigneeDesignee

Colour contrast checker

Check that your text is easy to read on its background, on a flex from far away or a post on a phone. எழுத்து பின்னணியில் தெளிவாகத் தெரிகிறதா என்று பார்க்கலாம். Free, no sign-up, and it runs in your browser.

வணக்கம்! Big heading text

Normal text: shop name, phone number and address.

Contrast 5.74 : 1

  • Normal text (needs 4.5 : 1): easy to read
  • Large text (needs 3 : 1): easy to read
  • Icons and graphics (needs 3 : 1): easy to read

How to use it

  1. Pick the text colour and the background colour, or type their HEX codes.
  2. See the contrast and whether it passes for normal text, large text and graphics.
  3. If it is too faint, press “Fix it” for the nearest colour that passes.

Questions

What contrast is enough?
At least 4.5 : 1 for normal text and 3 : 1 for big headings and logos (WCAG). For a flex read from far away, aim higher.
Where do I find a colour’s HEX code?
In the Designee editor, the colour picker shows it. Our colour palette tool also lists the HEX codes of a logo or photo.
Are my files uploaded?
No. This tool runs entirely in your browser, so your files and text never leave your device. It works without an account.

Related tools