Online Tools HarborLight Blue color codes
| CSS name | lightblue |
|---|---|
| HEX | #ADD8E6 |
| RGB | rgb(173, 216, 230) |
| HSL | hsl(195, 53%, 79%) |
| CMYK | cmyk(25%, 6%, 0%, 10%) |
| Decimal | 11393254 |
Shades of Light Blue (darker)
#9CC2CF · #8AADB8 · #7997A1 · #68828A · #576C73 · #45565C · #344145 · #232B2E · #111617
Tints of Light Blue (lighter)
#B5DCE9 · #BDE0EB · #C6E4EE · #CEE8F0 · #D6ECF3 · #DEEFF5 · #E6F3F8 · #EFF7FA · #F7FBFD
Color harmonies
| Complementary | #E6BBAD |
|---|---|
| Triadic | #E6ADD8, #D8E6AD |
| Analogous | #ADE6D8, #ADBBE6 |
Accessibility (WCAG contrast)
| White text on Light Blue | 1.53:1 · Fail |
|---|---|
| Black text on Light Blue | 13.74:1 · AAA |
Use Light Blue in code
.element {
color: lightblue; /* or #add8e6 */
background-color: rgb(173 216 230 / 0.5);
}Frequently asked questions
What is the hex code for Light Blue?
Light Blue is #ADD8E6 in HEX, rgb(173, 216, 230) in RGB and hsl(195, 53%, 79%) in HSL.
Can I use "lightblue" directly in CSS?
Yes. "lightblue" is one of the 148 standard CSS named colors, so color: lightblue; works in every browser.
Is Light Blue readable on white?
The contrast ratio of Light Blue on white is 1.53:1 (WCAG Fail). On black it is 13.74:1 (AAA).
What is the complementary color of Light Blue?
The complementary color (opposite on the color wheel) is #E6BBAD.
Similar colors
Powder Blue#B0E0E6Light Steel Blue#B0C4DEPale Turquoise#AFEEEESky Blue#87CEEBLight Gray#D3D3D3Light Grey#D3D3D3Light Sky Blue#87CEFAGainsboro#DCDCDC
Convert any color with the Color Converter, generate palettes with the Random Color Generator, or browse all 148 CSS color names.