Nearest named color · #4FA8AF
#4FA8AF
Nearest named color: Thalassa
#4FA8AF (rgb(79 168 175), hsl(184 38% 50%), oklch(0.68 0.085 202.3)) is closest to the named color Thalassa. See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
#4FA8AF
oklch(0.68 0.085 202.3)
Color conversions
- HEX
- #4fa8af
- RGB
- rgb(79 168 175)
- HSL
- hsl(184 38% 50%)
- HWB
- hwb(184 31% 31%)
- OKLCH
- oklch(0.68 0.085 202.3)
- OKLab
- oklab(0.68 -0.079 -0.032)
- CIE Lab
- lab(63.68 -26.23 -12.21)
- LCH
- lch(63.68 28.93 205)
- CMYK
- cmyk(55% 4% 0% 31%)
Tints · Shades · Tones
Tints
- 64B1B7
- 76B9BF
- 88C2C7
- 9ACBCF
- ABD3D7
- BCDCDF
- CDE5E7
- DDEDEF
- EEF6F7
Shades
- 449298
- 387C81
- 2E676B
- 235256
- 193F41
- 102C2E
- 071A1C
- 020A0B
- 000101
Tones
- 57A4AA
- 5EA0A5
- 649CA1
- 69989C
- 6E9497
- 729093
- 768C8E
- 7A8889
- 7D8485
Color harmonies
Complementary +180°
- 4FA8AF
Thalassa
- C88380
≈ Prancer
Analogous -30° +30°
- 4FA8AF
Thalassa
- 5CAA92
≈ Artemesia Green
- 5EA2C4
≈ Scott Base
Triadic +120° +240°
- 4FA8AF
Thalassa
- B287B8
≈ African Violet
- B29359
≈ Jungle Expedition
Split-complementary +150° +210°
- 4FA8AF
Thalassa
- C2829E
≈ Cashmere Rose
- C38966
≈ Sassy
Tetradic +90° +180° +270°
- 4FA8AF
Thalassa
- 998FC9
≈ Hermosa
- C88380
≈ Prancer
- 999E5F
≈ Sweet Pea
Contrast & accessibility
Ag
FailOn white
WCAG 2.78:1 · APCA Lc 53
Ag
AAAOn black
WCAG 7.55:1 · APCA Lc 48
Best text color: #000000
WCAG 7.55:1 (AAA) · APCA Lc 48
Contrast pairs
Code snippets
CSS
:root {
--thalassa: #4fa8af;
--thalassa-rgb: 79 168 175;
--thalassa-oklch: oklch(0.68 0.085 202.3);
}
.element {
color: var(--thalassa);
background-color: hsl(184 38% 50%);
border-color: oklch(0.68 0.085 202.3);
}Tailwind CSS v4
@theme {
--color-thalassa: #4fa8af;
--color-thalassa-50: #dafdff;
--color-thalassa-100: #c8f1f5;
--color-thalassa-200: #aadfe5;
--color-thalassa-300: #82c5cc;
--color-thalassa-400: #5baeb4;
--color-thalassa-500: #2b979f;
--color-thalassa-600: #287f86;
--color-thalassa-700: #20666b;
--color-thalassa-800: #154b4e;
--color-thalassa-900: #0d3436;
--color-thalassa-950: #012021;
}SCSS
$thalassa: #4fa8af;
$thalassa-rgb: 79, 168, 175;
$thalassa-light: mix(#fff, $thalassa, 20%);
$thalassa-dark: mix(#000, $thalassa, 20%);
.element {
color: $thalassa;
box-shadow: 0 0 0 2px rgba($thalassa, 0.35);
}