Color Contrast Check

#9c27b0 on #0f172a

Material Purple (#9c27b0) text on Dark Slate (#0f172a)

2.83:1

Fails WCAG AA

WCAG results for #9c27b0 on #0f172a

CheckRequiresResult
Normal text — AA 4.5:1 ✗ Fail
Large text — AA 3:1 ✗ Fail
Normal text — AAA 7:1 ✗ Fail
Large text — AAA 4.5:1 ✗ Fail
UI & graphics (non-text) 3:1 ✗ Fail

At 2.83:1, Material Purple (#9c27b0) on Dark Slate (#0f172a) does not meet the WCAG 2.1 AA minimum for either normal (4.5:1) or large (3:1) text. It should not be used for readable text.

How to fix it

The nearest accessible alternatives that pass AA for normal text:

  • Darken/adjust the text to #c34cd7 (keeps the #0f172a background) — check it.
  • Or adjust the background to #d3dbef (keeps the #9c27b0 text) — check it.

Open this pair in the contrast checker →

Related color pairs

How contrast ratio is measured

The ratio compares the relative luminance of the text and background, on a scale from 1:1 (no contrast) to 21:1 (black on white). WCAG 1.4.3 requires 4.5:1 for normal text and 3:1 for large text; the stricter AAA level wants 7:1 and 4.5:1. Low contrast is the single most common WCAG failure and a frequent trigger in ADA website lawsuits — but it's also one of the easiest to fix.

Frequently asked questions

Is #9c27b0 text on a #0f172a background accessible?

Its contrast ratio is 2.83:1. For normal-size text it fails WCAG 2.1 AA (which requires 4.5:1).

What is the contrast ratio of #9c27b0 and #0f172a?

Exactly 2.83:1, computed with the WCAG relative-luminance formula. The maximum possible ratio is 21:1 (black on white).

Does #9c27b0 on #0f172a pass WCAG AAA?

For normal text, AAA requires 7:1, so this pair does not pass AAA. For large text, AAA requires 4.5:1, which it does not pass.

Contrast is one of ~50 WCAG checks

Fixing color is a great start, but automated tools catch only 30–40% of accessibility issues. Get a free human-led scan of what a contrast check can't see.