Named color · #7BBBC8
Azure Lake
Azure Lake is #7BBBC8: rgb(123 187 200), hsl(190 41% 63%), oklch(0.754 0.068 211.8). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Cyan mean? → · Azure Lake color name →
#7BBBC8
oklch(0.754 0.068 211.8)
Color conversions
- HEX
- #7bbbc8
- RGB
- rgb(123 187 200)
- HSL
- hsl(190 41% 63%)
- HWB
- hwb(190 48% 22%)
- OKLCH
- oklch(0.754 0.068 211.8)
- OKLab
- oklab(0.754 -0.058 -0.036)
- CIE Lab
- lab(71.92 -18.78 -13.44)
- LCH
- lch(71.92 23.1 215.6)
- CMYK
- cmyk(38% 7% 0% 22%)
Tints · Shades · Tones
Tints
- 89C2CD
- 96C9D3
- A4CFD8
- B1D6DE
- BEDDE3
- CBE4E9
- D8EBEE
- E5F1F4
- F2F8F9
Shades
- 6AA2AE
- 5A8A94
- 4A737B
- 3A5C63
- 2C464C
- 1E3236
- 101F21
- 050D0F
- 010202
Tones
- 7CB5C1
- 7EAFB9
- 7FA9B2
- 7FA3AB
- 809DA3
- 80979C
- 809295
- 808C8E
- 808687
Color harmonies
Complementary +180°
- 7BBBC8
Azure Lake
- D7A094
≈ Indian Mesa
Analogous -30° +30°
- 7BBBC8
Azure Lake
- 7EBEB2
≈ Mintage
- 89B5D7
≈ Periwinkle Sky
Triadic +120° +240°
- 7BBBC8
Azure Lake
- C9A0C3
≈ Stormy Sunrise
- BEAE7E
≈ Nettle
Split-complementary +150° +210°
- 7BBBC8
Azure Lake
- D49EAC
≈ Lili Elbe’s Pink
- CFA683
≈ Sunset Beige
Tetradic +90° +180° +270°
- 7BBBC8
Azure Lake
- B7A5D4
≈ Grape Illusion
- D7A094
≈ Indian Mesa
- A8B686
≈ Great Green
Contrast & accessibility
Ag
FailOn white
WCAG 2.14:1 · APCA Lc 42
Ag
AAAOn black
WCAG 9.78:1 · APCA Lc 60
Best text color: #000000
WCAG 9.78:1 (AAA) · APCA Lc 60
Contrast pairs
Code snippets
CSS
:root {
--azure-lake: #7bbbc8;
--azure-lake-rgb: 123 187 200;
--azure-lake-oklch: oklch(0.754 0.068 211.8);
}
.element {
color: var(--azure-lake);
background-color: hsl(190 41% 63%);
border-color: oklch(0.754 0.068 211.8);
}Tailwind CSS v4
@theme {
--color-azure-lake: #7bbbc8;
--color-azure-lake-50: #e0fbff;
--color-azure-lake-100: #cfeef6;
--color-azure-lake-200: #b4dce6;
--color-azure-lake-300: #90c1cd;
--color-azure-lake-400: #6eaab6;
--color-azure-lake-500: #4b92a0;
--color-azure-lake-600: #407c87;
--color-azure-lake-700: #33636c;
--color-azure-lake-800: #23494f;
--color-azure-lake-900: #183337;
--color-azure-lake-950: #081e22;
}SCSS
$azure-lake: #7bbbc8;
$azure-lake-rgb: 123, 187, 200;
$azure-lake-light: mix(#fff, $azure-lake, 20%);
$azure-lake-dark: mix(#000, $azure-lake, 20%);
.element {
color: $azure-lake;
box-shadow: 0 0 0 2px rgba($azure-lake, 0.35);
}