Aa
- AA normal text
- Pass
- AA large text
- Pass
- AAA normal text
- Fail
- AAA large text
- Pass
Color reference
Calculated profile
At 240° hue, Tailwind Zinc 500 is a near-neutral, mid-lightness, achromatic sRGB color. Its relative luminance is 16.73%. For text on this background, #FFFFFF produces the stronger contrast at 4.83:1.
02
Equivalent sRGB notations calculated from the same six-digit HEX value.
03
Ratios use WCAG relative luminance. Passing a ratio does not by itself certify an interface.
Aa
Aa
04
Tints mix the color with white; shades mix it with black in sRGB.
05
These colors keep the original HSL saturation and lightness while rotating hue. They are mathematical starting points, not automatic design recommendations.
06
Eight-digit HEX and modern rgb() alpha syntax for the same opacity.
07
A small custom-property block using the calculated foreground with the stronger black-or-white contrast.
--color-tailwind-zinc-500: #71717A;
--color-tailwind-zinc-500-rgb: 113 113 122;
--color-tailwind-zinc-500-hsl: 240 4% 46%;
color: #FFFFFF;
background-color: var(--color-tailwind-zinc-500);Community review
Correction for Tailwind Zinc 500#71717A
Found an inaccurate name, explanation, source, or accessibility detail? Send a concise correction for editorial review.
08 / Verification
The color name and HEX value are checked against the cited standard. RGB, HSL, HWB, luminance, and contrast are then calculated from that HEX value using published formulas.
Source for the name and HEX: Tailwind CSS default color palette