Contrast Check: #1DA1F2 on #FFFFFF

Twitter Blue (#1DA1F2) on White (#FFFFFF) — 2.83:1, fails all WCAG tiers.

At a glance

Contrast ratio
2.83:1
WCAG AA (normal text)
Fail
WCAG AA (large text)
Fail
WCAG AAA (normal text)
Fail
UI components / non-text
Fail

Twitter Blue text on a white background is one of the most frequently checked combinations in web design. The measured WCAG 2.1 contrast ratio is 2.83:1. It fails WCAG AA for body text. You should darken the foreground or lighten the background before shipping. The legacy Twitter brand color failed AA on white — a long-running accessibility complaint that drove platforms to introduce darker variants.

Frequently asked questions

Is #1DA1F2 on #FFFFFF accessible?
For WCAG 2.1 AA — the most common conformance target — the answer is no for normal-size body text. Normal text needs 4.5:1 and this combination measures 2.83:1. Large text (18pt+ or 14pt+ bold) needs only 3:1, so this combination still fails for headings and large UI labels. AAA conformance demands 7:1; this combination falls short of that bar.
Where is this combination commonly used?
Brand logos and marketing only — never for body text on white.
How is this ratio calculated?
WCAG 2.1 contrast ratio is (L1 + 0.05) / (L2 + 0.05) where L1 and L2 are the relative luminances of the lighter and darker colors. Each channel is gamma-corrected (linearized) before applying coefficients 0.2126·R + 0.7152·G + 0.0722·B. The two formulas weight green most because the human eye is most sensitive to green wavelengths.
What if I need a higher ratio than 2.83:1?
Adjust either the foreground or background lightness in the calculator above. The Suggestions panel automatically computes the nearest passing color in each direction (lighter or darker) for AA and AAA targets.

Related Tools

palette

Color Palette

Extract colors from images or generate harmonious palettes.

blur_on

Color Gradient Test

Test your monitor for color banding and 8-bit vs 10-bit depth with smooth gradients across grayscale, red, green, blue, and hue channels.

gradient

CSS Gradient

Visual CSS background generator & code.

draw

Logo Maker

Design logos with a drag-and-drop canvas editor. Add text, icons, and shapes — export PNG, SVG, or ZIP.

style

CSS Cheatsheet

Quick reference for CSS selectors, Flexbox, Grid, typography, animations, and modern CSS. Search and copy instantly.