Slate Gray on White Smoke: Contrast Check

Using slate gray on white smoke

A Slate Gray caption can appear subtle on White Smoke while still missing the normal-text threshold. For a compact caption, try darker text before changing its size.

WCAG text contrast results

This pair passes AA for large text, but fails for normal text. The displayed ratio is rounded to two decimal places; every decision uses the full calculation.

Choose the result for your text size

A 16 px regular label uses the normal-text result. A 24 px regular heading qualifies as large text. Here that distinction changes the AA result: the heading passes, while the label fails. If a small label fails, try a different color before making the label larger.

.pair-example {
  color: #708090;
  background-color: #F5F5F5;
  font-size: 16px;
}

Try the reverse pair

Use Swap colors to put white smoke text on slate gray. The ratio remains 3.72:1, but the page can feel very different when most of it becomes slate gray. Check the new arrangement with real text and the surrounding layout.