Maroon Colors  ·  Color Library

Palettes / Colors / #77BCDB

#77BCDB — Light Blue

#77BCDB is a blue color we call Light Blue, closest to the named color SkyBlue (#87CEEB). It belongs to the blue family.

Color name

Closest CSS keyword: skyblue (#87CEEB) — not an exact match. CSS skyblue gives you #87CEEB, a different color; use #77BCDB when you need this exact shade.

Sources: common names follow widely used color-name references; CSS keywords and their hex values follow the CSS Color specification.

#77BCDB is a cool blue color associated with trust, calm and professionalism. It sits comfortably in the middle: usable for large areas in soft schemes, or as a supporting color beside something stronger.

Its strongest partner is its complement #DB9676; it also sits naturally between #76DBC8 and #7688DB. In the palettes below you can see it working alongside real color combinations from our collection.

#77BCDB · RGB 119, 188, 219

Download PNG swatch SVG

Color values

HEX#77BCDB
RGB119, 188, 219
HSL199°, 58%, 66%
HSV199°, 46%, 86%
CMYK46%, 14%, 0%, 14%
XYZ38.38, 45.00, 73.68
Yxy45.00, 0.2443, 0.2865
CIE-Lab72.89, -13.61, -22.32
Hunter Lab67.08, -11.88, -22.65

RGB & CMYK percentages

Red 47% · Green 74% · Blue 86%

Cyan 46% · Magenta 14% · Yellow 0% · Key 14%

CMYK values are unprofiled approximations for screen reference — not a print-proofing guarantee.

Previews

Sample text in #77BCDB on black
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Sample text in #77BCDB on white
Lorem ipsum dolor sit amet, consectetur adipiscing elit.

CSS code for #77BCDB

.text { color: #77BCDB; }
.background { background-color: #77BCDB; }
.border { border: 3px solid #77BCDB; }
.text-rgb { color: rgb(119, 188, 219); }
.text-hsl { color: hsl(199, 58%, 66%); }
.text-shadow-hex { text-shadow: 4px 4px 2px #77BCDB; }
.text-shadow-rgba { text-shadow: 4px 4px 2px rgba(119, 188, 219, 0.8); }
.box-shadow-hex { box-shadow: 1px 1px 3px 2px #77BCDB; }
.box-shadow-rgba { box-shadow: 1px 1px 3px 2px rgba(119, 188, 219, 0.8); }

HTML: <p style="color:#77BCDB">Text here</p> · <div style="background-color:#77BCDB">Div content here</div>

Shades of #77BCDB

#5EAFD4#46A3CE#3291BD#2C7FA5#256C8D#1F5A75#19475D#113140#0B1F28#040C10

Tints of #77BCDB

#82C1DE#8EC7E1#9ACDE4#A6D3E7#B2D9EB#BFDFEE#CBE5F1#D7EBF4#E3F1F8#EFF7FB

Tones of #77BCDB

#7DB8D4#85B5CC#8CB3C5#93B0BE#9AAEB7#A1ABAF

Color harmonies

Complementary — #DB9676:

Analogous:

Triadic:

Contrast & accessibility

Against white text2.10:1 Fails
Against black text10.00:1 AAA

Best text color on #77BCDB: #000000.

Semi-transparent (opacity) text on #77BCDB

Text set with opacity blends into the background, so its real contrast is lower than the solid ratios above. Choose a text color and an opacity to see the blended color and its true ratio:

100%
Sample heading text
Smaller body text shows the effect best.

Blended color: · Contrast against #77BCDB: ·

How #77BCDB looks with color blindness

Simulated with standard Machado color-vision-deficiency matrices — useful when this color carries meaning in charts, maps or interfaces:

Protanopia · #9595D3Deuteranopia · #918CD2Tritanopia · #7ACECC

Closest design-system colors

The nearest matches in the Tailwind CSS, Material Design and Bootstrap palettes — handy when you need a framework class instead of a raw hex:

Material Grey 500 · #9E9E9ETailwind blue 500 · #3B82F6Tailwind indigo 500 · #6366F1

Palettes with a similar color

These palettes use a close neighbour of #77BCDB rather than the exact color:

Serene Saffron
#2C975E · #45C9C0 · #7DB5D9 · #B3BBE9
Palette B1f0f7
#B1F0F7 · #81BFDA · #F5F0CD · #FADA7A
Tranquil Mirage
#26D63B · #2CC380 · #62DFDE · #77B2DF
Dusty Saffron
#74301F · #D3905B · #70C4D9 · #A8DEE0
Palette Fffdb7
#FFFDB7 · #AEF4A4 · #79B8D1 · #E36488
Golden Ruby Mosaic
#7BC5D6 · #49AAC0 · #358EA1 · #255D6A

Similar colors

The closest colors that actually appear in our palette collection — click any to open its page:

#7DB5D9#81BFDA#77B2DF#70C4D9#79B8D1#7BC5D6#78B7D0#82B7D9#74B0DE#82B5DA#7AB2D3#7FC7D9

Browse neighbouring colors

← #77BCDA  ·  #77BCDC →

Frequently asked questions

What color is #77BCDB?

#77BCDB is Light Blue, a blue color (RGB 119, 188, 219). Its closest standard named color is SkyBlue.

What is the RGB and HSL of #77BCDB?

#77BCDB is RGB 119, 188, 219 — HSL 199°, 58%, 66% — CMYK 46%, 14%, 0%, 14%.

What colors go with #77BCDB?

Its complement is #DB9676; analogous partners are #76DBC8 and #7688DB. It also appears in 6+ palettes in our collection.

Can I use #77BCDB for text?

Black text on #77BCDB has a contrast ratio of 10.00:1 (passes WCAG AA); white text gives 2.10:1.