#030712 — Tints, Shades & Color Values
#030712 is a very dark, vivid blue. In Tailwind CSS this exact color is the utility class gray-950 (e.g. bg-gray-950, text-gray-950). Its nearest CSS named color is black (#000000). For readable text on a #030712 background, white text gives the strongest contrast (20.13:1). Because it is dark, #030712 suits text, navigation bars, and footers on light backgrounds, and its tints make natural hover and surface colors.
Color Values
| Hex | #030712 |
|---|---|
| RGB | rgb(3, 7, 18) |
| HSL | hsl(224, 71%, 4%) |
| HSV / HSB | 224°, 83%, 7% |
| Nearest named | black (#000000) |
Need these in another format? Use our hex to RGB converter for quick two-way conversion.
#030712 in Tailwind CSS (gray-950)
#030712 ships with Tailwind CSS as gray-950 — use it as bg-gray-950, text-gray-950, or border-gray-950. It sits at step 950 of the gray 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 #030712 (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
#1c202a -
20% tint
#353941 -
30% tint
#4f5159 -
40% tint
#686a71 -
50% tint
#818389 -
60% tint
#9a9ca0 -
70% tint
#b3b5b8 -
80% tint
#cdcdd0 -
90% tint
#e6e6e7
Shades of #030712 (Mixed with Black)
Each step blends the base color toward black using new = old × (1 − factor).
-
10% shade
#030610 -
20% shade
#02060e -
30% shade
#02050d -
40% shade
#02040b -
50% shade
#020409 -
60% shade
#010307 -
70% shade
#010205 -
80% shade
#010104 -
90% shade
#000102
WCAG Contrast & Accessibility
Contrast ratios for text placed on a #030712 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 20.13:1 — AA normal: Pass · AA large: Pass · AAA: Pass |
|---|---|
| Black text 1.04: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 #030712 from the ramps above as the background instead — small lightness moves change contrast quickly. Test any other pair with the free contrast checker.
More blue colors in the library: #09090B (zinc-950), #020617 (slate-950), #0F172A (slate-900), #082F49 (sky-950), #1E293B (slate-800), #1E1B4B (indigo-950).
Frequently Asked Questions
-
What color is #030712?
#030712 is a very dark, vivid blue —
rgb(3, 7, 18). Its nearest CSS named color isblack. In Tailwind CSS it isgray-950. -
How do I make tints and shades of #030712?
Mix #030712 with white for tints and with black for shades. A 20% tint of #030712 is
#353941and a 20% shade is#02060e— the full 10%–90% ramps are precomputed on this page, or open #030712 in the generator for finer steps. -
What text color is readable on #030712?
White text gives the strongest contrast on a #030712 background at 20.13:1, which passes WCAG AA and AAA for normal text.
-
What is the Tailwind CSS class for #030712?
gray-950— use it asbg-gray-950,text-gray-950, orborder-gray-950. The full gray 50–950 ramp is linked above.
Browse more colors in the color library, or start from any hex code on the HexTints homepage.
#030712? Put it on a free link-in-bio page →