Battleship Grey #6B7C85

Battleship Grey is a medium-dark close to neutral grey with hex code #6B7C85 and RGB rgb(107, 124, 133).

Aa

Black text reads best on this color (4.84:1).

About this color

#6B7C85 is a medium-dark close to neutral grey. In OKLCH its lightness is 58%, its chroma 0.024. It has too little chroma to lean warm or cool. It is the named color Battleship Grey. Black text reads best on it, at 4.84:1.

Hue familyNeutrals
Lightnessmedium-dark (58%)
Chromaclose to neutral grey (0.024)
Temperatureneutral
Nearest nameBattleship Grey
Black text4.84:1
White text4.33:1

Colors that go with Battleship Grey

Matches found by rotating Battleship Grey around the OKLCH hue wheel, each labelled with the closest name in our list.

Color palettes with Battleship Grey

Curated color palettes that contain a color within ΔE 0.06 (OKLab) of Battleship Grey, closest first.

Similar named colors

The eight named colors closest to Battleship Grey, with their ΔE distance.

More about Battleship Grey

How to make Battleship Grey

A starting recipe from common paint colors, found with a spectral paint model (the color mixer’s paint mode). Real pigments vary, so mix a small test batch and adjust.

  • 3 parts gray
  • 1 part blue

Recipe result: #6C838D, a difference of ΔE 0.022 from Battleship Grey. That is very close: most people will not see the difference.

What colors make gray? | Color mixing chart

Codes for Battleship Grey in every format

HEX#6B7C85
RGBrgb(107, 124, 133)
HSLhsl(201, 11%, 47%)
OKLCHoklch(57.6% 0.024 230.9)

Contrast

WCAG 2 contrast ratios are the conformance target: AA needs 4.5:1 for body text and 3:1 for large text, AAA needs 7:1. APCA Lc values are supplementary guidance from the WCAG 3 drafts.

PairWCAG 2ResultAPCAAPCA guidance
White text on #6B7C85 4.33:1 AA large text Lc -75.5 Fine for body text
Black text on #6B7C85 4.84:1 AA Lc 34.1 Non-text elements, placeholder text
#6B7C85 text on white 4.33:1 AA large text Lc 70.0 Content text, not long reading
#6B7C85 text on black 4.84:1 AA Lc -31.7 Non-text elements, placeholder text

Shades and tints of Battleship Grey

A 50–950 scale built in OKLCH: the hue is held, lightness follows a Tailwind v4-like curve, and every step is kept inside the sRGB gamut. This color sits at step 600.

  1. Step 50

    50

    #F4F6F6

    oklch(97.2% 0.002 197.1)

  2. Step 100

    100

    #E8EAEB

    oklch(93.6% 0.003 228.8)

  3. Step 200

    200

    #D5DADC

    oklch(88.5% 0.006 223.5)

  4. Step 300

    300

    #BAC2C6

    oklch(80.9% 0.011 228.9)

  5. Step 400

    400

    #96A3AA

    oklch(70.7% 0.018 231)

  6. Step 500

    500

    #7C8C95

    oklch(63% 0.023 232.4)

  7. Step 600

    600 (this color)

    #6B7C85

    oklch(57.6% 0.024 230.9)

  8. Step 700

    700

    #54636B

    oklch(49% 0.022 231.1)

  9. Step 800

    800

    #455158

    oklch(42.7% 0.019 233.5)

  10. Step 900

    900

    #3A4348

    oklch(37.7% 0.015 232.1)

  11. Step 950

    950

    #22272A

    oklch(26.9% 0.009 234.1)

Export this scale for Tailwind in the Tailwind colors tool

Battleship Grey with color blindness

Simulated with the Machado et al. (2009) model. ΔE is how far the color moves: below about 0.02 you would not notice a change.

VisionSeen asShift (ΔE)
Protanopia (no red cones)#787B860.019
Deuteranopia (no green cones)#7478850.016
Tritanopia (no blue cones)#647F7F0.018
Achromatopsia (no color)#7979790.024

Use Battleship Grey in your product

Turn it into light and dark UI roles checked for contrast, then export to Tailwind v4, shadcn/ui, CSS or design tokens.