#686F9C

Color Details

HEX
#686F9C
RGB
rgb(104, 111, 156)
HSL
hsl(232, 21%, 51%)
CMYK
cmyk(33%, 29%, 0%, 39%)
Best text on this color #FFFFFF (CR 4.84:1) Determined by WCAG contrast ratio

Readability Previews

Black on #686f9c
Contrast 4.34:1 Fail
White on #686f9c
Contrast 4.84:1 AA
#686f9c on Black
Contrast 4.34:1 Fail
#686f9c on White
Contrast 4.84:1 AA

Tints & Shades

#868cb0
#a4a9c4
#c3c5d7
#53597d
#3e435e
#2a2c3e

Complement & Analogous

#9c9568
#7b679e
#67899e

Triadic

#9c686f
#6f9c68

Monochrome

#2a2c3e #3e435e #686f9c #a4a9c4 #c3c5d7 #e1e2eb

Analogous

#67899e #95acbb #686f9c #9585b1 #7b679e #62527e

Complementary Mix

#3e435e #686f9c #a4a9c4 #9c9568 #bfba9d #656144

Nearby Colors

#686f9b
#686f9d
#686f8c
#686fac

Embed #686F9C swatch

Embed this swatch

Use this HTML on your site (free with a link):

Open image

About #686F9C

#686F9C converts to RGB(104, 111, 156) and HSL(232, 21%, 51%). This page provides quick readability checks, related hues (complementary and analogous), and ready-made palettes so you can drop the color into UI components, images, or CSS immediately.

Tip: Use the “Best text” chip above as a safe default foreground on this color (chosen by contrast ratio).

#686F9C FAQs

What is the RGB value of #686F9C?
RGB: 104, 111, 156. Copy as CSS: rgb(104, 111, 156)
Is #686F9C a web-safe color?
No — not in the 216-color “web-safe” palette.
What is the complementary color of #686F9C?
Complement: #9c9568.
Does #686F9C have good contrast on white or black?
On white: 4.84:1 (AA (normal text)). On black: 4.34:1 (AA (large text)).