#047857 on #000000 contrast ratio

3.82:1

Very dark teal (Tailwind emerald-700) text (#047857) on a black background (#000000) is only acceptable for large text and UI components under WCAG 2.2. It passes 2 of 5 checks below.

Swap: #000000 on #047857

Large text sample

Normal body text in #047857 on #000000. The quick brown fox jumps over the lazy dog.

WCAG 2.2 results

WCAG 2.2 contrast results for #047857 on #000000
Normal text — WCAG 1.4.3 AA4.5:1Fail
Large text — WCAG 1.4.3 AA3:1Pass
UI components & icons — WCAG 1.4.11 AA3:1Pass
Normal text — WCAG 1.4.6 AAA7:1Fail
Large text — WCAG 1.4.6 AAA4.5:1Fail

Nearest passing colours

How it looks with colour blindness

Simulated with the Machado et al. (2009) model at full severity.

  • Aa

    Protanopia (no red cones)

    4.11:1

  • Aa

    Deuteranopia (no green cones)

    3.60:1

  • Aa

    Tritanopia (no blue cones)

    3.91:1

  • Aa

    Achromatopsia (no colour)

    3.82:1

Try a different pair

Colours

Hex, rgb() or hsl(). Alpha is composited.

Preview

Large heading text

Normal body text at 14 px. The quick brown fox jumps over the lazy dog.

Outlined buttonA text link

Colour-blindness preview

Simulated with Machado et al. (2009), full severity.

  • AaProtanopia (no red cones)4.11:1
  • AaDeuteranopia (no green cones)3.60:1
  • AaTritanopia (no blue cones)3.91:1
  • AaAchromatopsia (no colour)3.82:1

Contrast ratio

3.82:1

WCAG 2.2 contrast verdicts
CheckCriterionNeedsResult
Normal text1.4.3 AA4.5:1Fail
Large text1.4.3 AA3:1Pass
UI components & graphics1.4.11 AA3:1Pass
Normal text1.4.6 AAA7:1Fail
Large text1.4.6 AAA4.5:1Fail

Nearest passing colours

Same hue, lightness adjusted in OKLCH.

AA — 4.5:1

Change text

#1d8462 · 4.52:1

Change background

#e9e9e9 · 4.51:1

AAA — 7:1

Change text

#47a682 · 7.04:1

Change background: no colour with this hue reaches the target.

Large text means at least 24 CSS px, or 18.66 CSS px bold. Ratios are truncated, never rounded, so 4.49:1 is shown as failing 4.5:1.

Questions about this pair

Is #047857 on #000000 accessible?
Only for large text. At 3.82:1 it meets the 3:1 large-text and UI-component thresholds but fails the 4.5:1 needed for normal body text.
What is the contrast ratio of #047857 and #000000?
3.82:1, calculated with the WCAG 2.2 relative luminance formula. The ratio is truncated, not rounded, so it never shows a failing pair as passing.
What colour passes AA on #000000?
#1d8462 is the closest colour to #047857 — same hue, adjusted lightness — that reaches 4.5:1 on #000000.