#525252 — Tints, Shades & Color Values
#525252 is a dark, nearly neutral gray. In Tailwind CSS this exact color is the utility class neutral-600 (e.g. bg-neutral-600, text-neutral-600). Its nearest CSS named color is darkslategray (#2f4f4f). For readable text on a #525252 background, white text gives the strongest contrast (7.81:1). #525252 sits in the middle of the lightness range, so it can serve as a primary brand or accent color — use its tints for backgrounds and its shades for text and pressed states.
Color Values
| Hex | #525252 |
|---|---|
| RGB | rgb(82, 82, 82) |
| HSL | hsl(0, 0%, 32%) |
| HSV / HSB | 0°, 0%, 32% |
| Nearest named | darkslategray (#2f4f4f) |
Need these in another format? Use our hex to RGB converter for quick two-way conversion.
#525252 in Tailwind CSS (neutral-600)
#525252 ships with Tailwind CSS as neutral-600 — use it as bg-neutral-600, text-neutral-600, or border-neutral-600. It sits at step 600 of the neutral ramp; every other step links to its own page:
Browse the full Tailwind palette in the color library, or generate in-between steps with the tint & shade generator.
Tints of #525252 (Mixed with White)
Each step blends the base color toward white using new = old + (255 − old) × factor. Click a swatch to open it in the generator.
-
10% tint
#636363 -
20% tint
#757575 -
30% tint
#868686 -
40% tint
#979797 -
50% tint
#a9a9a9 -
60% tint
#bababa -
70% tint
#cbcbcb -
80% tint
#dcdcdc -
90% tint
#eeeeee
Shades of #525252 (Mixed with Black)
Each step blends the base color toward black using new = old × (1 − factor).
-
10% shade
#4a4a4a -
20% shade
#424242 -
30% shade
#393939 -
40% shade
#313131 -
50% shade
#292929 -
60% shade
#212121 -
70% shade
#191919 -
80% shade
#101010 -
90% shade
#080808
WCAG Contrast & Accessibility
Contrast ratios for text placed on a #525252 background. WCAG requires 4.5:1 for normal text (AA), 3:1 for large text (AA), and 7:1 for normal text (AAA).
| Text color | White text 7.81:1 — AA normal: Pass · AA large: Pass · AAA: Pass |
|---|---|
| Black text 2.69:1 — AA normal: Fail · AA large: Fail · AAA: Fail |
If neither pure white nor pure black reaches the level you need, pick a lighter tint of #525252 from the ramps above as the background instead — small lightness moves change contrast quickly. Test any other pair with the free contrast checker.
More gray colors in the library: #57534E (stone-600), #52525B (zinc-600), #3F3F46 (zinc-700), #44403C (stone-700), #666666, #333333.
Frequently Asked Questions
-
What color is #525252?
#525252 is a dark, nearly neutral gray —
rgb(82, 82, 82). Its nearest CSS named color isdarkslategray. In Tailwind CSS it isneutral-600. -
How do I make tints and shades of #525252?
Mix #525252 with white for tints and with black for shades. A 20% tint of #525252 is
#757575and a 20% shade is#424242— the full 10%–90% ramps are precomputed on this page, or open #525252 in the generator for finer steps. -
What text color is readable on #525252?
White text gives the strongest contrast on a #525252 background at 7.81:1, which passes WCAG AA and AAA for normal text.
-
What is the Tailwind CSS class for #525252?
neutral-600— use it asbg-neutral-600,text-neutral-600, orborder-neutral-600. The full neutral 50–950 ramp is linked above.
Browse more colors in the color library, or start from any hex code on the HexTints homepage.
#525252? Put it on a free link-in-bio page →