Skip to content
Toolspire

CSS Tools

Color Contrast Checker

Color Contrast Checker is part of Toolspire and is ready as soon as this page loads. Paste two hex colours. The ratio uses the WCAG relative-luminance formula, and the sample line shows the pair.

Runs in this tabFreeNo account

On this page

What you can do here

Instant result

The figure updates as you change the inputs.

Copy in one click

Copy the result without selecting it by hand.

Private

The calculation stays on this device.

The sequence

How to use the Color Contrast Checker

  1. 1

    Enter the numbers

    Fill the fields. Empty or impossible values leave the result blank instead of inventing one.

  2. 2

    Read the result

    The main figure is the answer. The line under it is the working or the assumptions.

  3. 3

    Copy it

    Use the copy button if you are pasting into a document, a cheque or a stylesheet.

Worth knowing

  • Color Contrast Checker on Toolspire: Color Contrast Checker runs in the browser. Nothing you type is uploaded.
  • Paste two hex colours. The ratio uses the WCAG relative-luminance formula, and the sample line shows the pair.
  • The working is shown next to the result so you can check the figure before you copy it.
  • There is no account, no watermark and no daily limit.

What this page is for

Paste two hex colours. The ratio uses the WCAG relative-luminance formula, and the sample line shows the pair.

FAQ

Questions about Color Contrast Checker

Where does Color Contrast Checker run?

Color Contrast Checker runs in this tab on Toolspire. What you type or drop in is not sent to us and is not stored on a server.

Is the Color Contrast Checker free?

Yes. There is no account and no limit on how often you run it.

Is my input uploaded?

No. The page calculates in this tab. Closing the tab clears what you typed.

Can I rely on this for a legal or medical decision?

Use it to draft and to check your own arithmetic. Tax, employment and health rules have exceptions — confirm anything you will file or act on.

Does it work on a phone?

Yes. The fields are ordinary inputs and work in a current mobile browser.

Keep going

Related tools

CSS Gradient GeneratorNewCSS Gradient Generator on Toolspire. Build a linear or radial CSS gradient from hex colours, preview it. No account is required.CSS ToolsImage Color PickerNewImage Color Picker on Toolspire. Pick colours from any image: get HEX, RGB, HSL and CMYK codes with a zoom loupe, plus the image’s colour palette. Free.Image ToolsPX to REM ConverterNewPX to REM Converter on Toolspire. Convert pixels to rem and rem back to pixels using your root font size. No account is required.CSS ToolsCSS Glassmorphism GeneratorNewCSS Glassmorphism Generator on Toolspire: Glassmorphism generator: design frosted glass with blur, tint, border and grain, check text contrast live.CSS ToolsCSS Neumorphism GeneratorNewCSS Neumorphism Generator on Toolspire: Neumorphism generator: soft UI box-shadows from any colour and light angle, with contrast checks, pressed states.CSS ToolsBento Grid GeneratorNewBento Grid Generator on Toolspire: Draw tiles with the mouse, preview desktop, tablet and phone, and copy responsive CSS Grid, Tailwind or React code.CSS Tools

Open the full directory

Last updated Report a problem or suggest a feature