Nearest named color · #50A7AE
#50A7AE
Nearest named color: Atlas Cedar
#50A7AE (rgb(80 167 174), hsl(184 37% 50%), oklch(0.678 0.084 202.4)) is closest to the named color Atlas Cedar. See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
#50A7AE
oklch(0.678 0.084 202.4)
Color conversions
- HEX
- #50a7ae
- RGB
- rgb(80 167 174)
- HSL
- hsl(184 37% 50%)
- HWB
- hwb(184 31% 32%)
- OKLCH
- oklch(0.678 0.084 202.4)
- OKLab
- oklab(0.678 -0.078 -0.032)
- CIE Lab
- lab(63.39 -25.77 -12.08)
- LCH
- lch(63.39 28.47 205.1)
- CMYK
- cmyk(54% 4% 0% 32%)
Tints · Shades · Tones
Tints
- 64B0B6
- 77B8BE
- 89C1C6
- 9ACACE
- ABD3D6
- BCDCDE
- CDE4E6
- DEEDEE
- EEF6F7
Shades
- 449197
- 397B80
- 2E666A
- 245255
- 1A3E41
- 102C2E
- 071A1C
- 020A0B
- 000101
Tones
- 58A3A9
- 5E9FA5
- 649BA0
- 69989B
- 6E9497
- 729092
- 768C8E
- 7A8889
- 7D8485
Color harmonies
Complementary +180°
- 50A7AE
Atlas Cedar
- C68380
≈ Prancer
Analogous -30° +30°
- 50A7AE
Atlas Cedar
- 5CA992
≈ Artemesia Green
- 5FA1C3
≈ Gulf Stream Blue
Triadic +120° +240°
- 50A7AE
Atlas Cedar
- B186B6
≈ African Violet
- B19359
≈ Antique Honey
Split-complementary +150° +210°
- 50A7AE
Atlas Cedar
- C0829D
≈ Polignac
- C18967
≈ Sassy
Tetradic +90° +180° +270°
- 50A7AE
Atlas Cedar
- 998EC7
≈ Hermosa
- C68380
≈ Prancer
- 989D5F
≈ Stem
Contrast & accessibility
Ag
FailOn white
WCAG 2.80:1 · APCA Lc 54
Ag
AAAOn black
WCAG 7.47:1 · APCA Lc 48
Best text color: #000000
WCAG 7.47:1 (AAA) · APCA Lc 48
Contrast pairs
Code snippets
CSS
:root {
--atlas-cedar: #50a7ae;
--atlas-cedar-rgb: 80 167 174;
--atlas-cedar-oklch: oklch(0.678 0.084 202.4);
}
.element {
color: var(--atlas-cedar);
background-color: hsl(184 37% 50%);
border-color: oklch(0.678 0.084 202.4);
}Tailwind CSS v4
@theme {
--color-atlas-cedar: #50a7ae;
--color-atlas-cedar-50: #dafdff;
--color-atlas-cedar-100: #c8f1f5;
--color-atlas-cedar-200: #abdfe5;
--color-atlas-cedar-300: #83c4cb;
--color-atlas-cedar-400: #5cadb4;
--color-atlas-cedar-500: #2e969e;
--color-atlas-cedar-600: #2a7f86;
--color-atlas-cedar-700: #22666b;
--color-atlas-cedar-800: #164b4e;
--color-atlas-cedar-900: #0e3436;
--color-atlas-cedar-950: #011f21;
}SCSS
$atlas-cedar: #50a7ae;
$atlas-cedar-rgb: 80, 167, 174;
$atlas-cedar-light: mix(#fff, $atlas-cedar, 20%);
$atlas-cedar-dark: mix(#000, $atlas-cedar, 20%);
.element {
color: $atlas-cedar;
box-shadow: 0 0 0 2px rgba($atlas-cedar, 0.35);
}