Toolkeel

Colour converter and contrast checker

Translate colours between design and code formats, and check that text will be readable for everyone, including people with low vision.

  • Free
  • Private
  • No sign-up

Contrast checker

Aa

The quick brown fox jumps over the lazy dog.

Contrast ratio

—

    Stays on this device. Network requests since you started: 0 How to check this yourself
    1. Your text and dataRead from your device
    2. Worked on in this tabBy code running in your browser
    3. Ready to copyNothing is stored

    Never sent to a server. See how to check

    How to use it

    1. Type or pick a colour to convert it.

    2. Enter text and background colours to check contrast.

    3. Copy the values you need.

    About this tool

    Enter a colour in any common format (#2F54EB, 2f54eb, rgb(47, 84, 235) or hsl(228, 82%, 55%)) to get every other format. CMYK values are a simple mathematical conversion for reference; for professional print, use your printer's colour profile.

    The contrast checker uses the WCAG 2.2 formula. Normal text needs at least 4.5:1 (level AA), large text (about 24 px, or 18.7 px bold) and interface components need 3:1, and the stricter AAA level needs 7:1.

    Good to know

    • CMYK is an approximation without a print profile.
    • Contrast results do not account for transparency.

    Frequently asked questions

    How do I convert HEX to RGB?

    Type the HEX code (for example #FF8800). The RGB value, rgb(255, 136, 0), appears instantly.

    What contrast ratio is required for accessibility?

    WCAG level AA requires 4.5:1 for normal text and 3:1 for large text and UI components.

    Is the contrast check the same as Lighthouse?

    Yes, both use the WCAG relative-luminance formula.

    You might also need

    Last updated 2026-10-20 by the Toolkeel team. How we build and check our tools.