#778F9A

Blue Picked from an image · added 1 hour ago

Make gradient Edit

Architecture London

HEX: #778F9A
RGB: rgb(119, 143, 154)
HSL: hsl(199, 15%, 54%)
HSB: hsb(199, 23%, 60%)
CMYK: cmyk(23%, 7%, 0%, 40%)
CSS var: --colour: #778F9A;

Red 119

Green 143

Blue 154

Contrast

WCAG 2 ratios. Large text is 24px, or 18.66px bold, and up.

Aa White text

Aa On white

3.39:1 with white

AA · normal text 4.5:1 Fail
AA · large text 3:1 Pass
AAA · normal text 7:1 Fail
AAA · large text 4.5:1 Fail
Graphics & UI 3:1 Pass

Aa Black text

Aa On black

6.17:1 with black

AA · normal text 4.5:1 Pass
AA · large text 3:1 Pass
AAA · normal text 7:1 Fail
AAA · large text 4.5:1 Pass
Graphics & UI 3:1 Pass

Check against another colour

Aa Text on #778F9A

Aa #778F9A as text

3.39:1

AA · normal text 4.5:1 Fail
AA · large text 3:1 Pass
AAA · normal text 7:1 Fail
AAA · large text 4.5:1 Fail
Graphics & UI 3:1 Pass

Readable pairings

Minimum

Your saved colours with the most contrast against #778F9A.

#1B0201 #1B0201 · 5.85:1 AA
#081719 #081719 · 5.38:1 AA
#14151A #14151A · 5.36:1 AA
#171618 #171618 · 5.30:1 AA
#031927 #031927 · 5.27:1 AA
#1B1707 #1B1707 · 5.27:1 AA
#181914 #181914 · 5.20:1 AA
#0C1346 #0C1346 · 5.16:1 AA
#38070B #38070B · 5.13:1 AA
#480202 #480202 · 4.80:1 AA
#1C2237 #1C2237 · 4.63:1 AA
#292B25 #292B25 · 4.21:1 AA large
#2B2B35 #2B2B35 · 4.12:1 AA large
#561528 #561528 · 4.02:1 AA large
#472A18 #472A18 · 3.83:1 AA large
#06364A #06364A · 3.78:1 AA large
#043A35 #043A35 · 3.71:1 AA large
#372968 #372968 · 3.67:1 AA large
#691427 #691427 · 3.57:1 AA large
#691525 #691525 · 3.56:1 AA large
#353A15 #353A15 · 3.49:1 AA large
#383738 #383738 · 3.48:1 AA large
#780306 #780306 · 3.40:1 AA large
#FEFFFF #FEFFFF · 3.39:1 AA large
#FDFCFE #FDFCFE · 3.32:1 AA large
#FCFCFC #FCFCFC · 3.31:1 AA large
#FAFBF9 #FAFBF9 · 3.27:1 AA large
#FBFE65 #FBFE65 · 3.14:1 AA large
Very light door pink #FFF3F3 · 3.13:1 AA large
Dark dahlia eye purple #68245F · 3.08:1 AA large
#E9F4F7 #E9F4F7 · 3.03:1 AA large

Font previews

Results are for the heading at the chosen size and weight: large text (24px, or 18.66px bold) needs 3:1 for AA, other text 4.5:1.

Font Weight Size 32px Third colour

The quick brown fox Jumps over the lazy dog, sphinx of black quartz, judge my vow.

White text on #778F9A

The quick brown fox Jumps over the lazy dog, sphinx of black quartz, judge my vow.

#778F9A on white

The quick brown fox Jumps over the lazy dog, sphinx of black quartz, judge my vow.

Black text on #778F9A

The quick brown fox Jumps over the lazy dog, sphinx of black quartz, judge my vow.

#778F9A on black

The quick brown fox Jumps over the lazy dog, sphinx of black quartz, judge my vow.

Third colour text on #778F9A

The quick brown fox Jumps over the lazy dog, sphinx of black quartz, judge my vow.

#778F9A on third colour

Source image

Image this colour was picked from