Should flag

Pure black surfaces

Pure #000 background

Gray on color

Gray text on blue background

Gray text on green background

Low contrast

Light gray text on white — very low contrast

Dark gray text on near-black — low contrast

Welcome to Our Platform

The best solution for modern teams and businesses

Gradient text

Gradient Heading

AI color palette

Purple heading text

Styled <a> and <button> with low contrast

Get started

Text-bearing chip with low contrast

SEV-2

Tailwind color anti-patterns

bg-black — pure black bg

text-gray-400 on bg-blue-500 — gray on color

text-purple-500 heading

Purple-to-indigo gradient

color-mix nested hex must not report phantom black

Dark ink on a mixed green stop must not report on #000000

currentcolor surface via var() token

Faint warm gray on a bone currentcolor surface

Should pass

Tinted neutrals

Near-black bg, near-white text — tinted, not pure

Near-white bg, near-black text — good contrast, tinted

Pure white surface is acceptable

Pure #fff background with dark text — acceptable contrast

Good contrast

Near-white text on dark blue — high contrast, not pure white

Dark green text on green bg — same hue family

Distinctive accents (not AI purple)

Red heading — not AI purple

Amber heading — distinctive

Background-image url() ancestor (not low contrast)

White text on image background — should not flag low-contrast

Tailwind opacity-modified bg-black (not pure black)

bg-black/3 — 3% opacity, not pure black

hover:bg-black/5 — hover state, not pure black

bg-black/50 — 50% opacity, not pure black

Inline <a> without own background (must remain skipped)

Read more about this here if you want to learn more about the topic.

Styled <a> with good contrast (must not flag)

High contrast pill

Chip with good contrast (must not flag)

HEALTHY

Sub-9px decorative chip (below the font floor, must not flag)

tick

background: none resets an earlier background-color

light text over the dark panel, not the light code surface

Gradient-clipped text (issue #409 Case A — must not flag contrast)

Gradient Clipped Heading Text

Faint accent-glow gradient (issue #409 Case B — must not flag contrast)

Light body copy on a faint accent glow that composites to near-black

Muted secondary line on the same faint glow area here

color-mix gradient stop: nested ingredient is not a surface

Light copy on a faint mixed wash over a dark ground stays readable

color-mix nested hex is not a surface

WhatsApp-style light text on a mixed dark green gradient stays readable

currentcolor surface with good contrast

Dark ink text on a bone currentcolor surface

currentcolor surface with unresolvable token (must abstain)

Light text on an unknowable currentcolor surface

Emoji on light backgrounds

⚠️ 🚨 ✨ 🎨

⚠️ 🚨 ✨ 🎨