Named color · #557D73
Dull Turquoise
Dull Turquoise is #557D73: rgb(85 125 115), hsl(165 19% 41%), oklch(0.557 0.047 177.1). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Teal mean? → · Dull Turquoise color name →
#557D73
oklch(0.557 0.047 177.1)
Color conversions
- HEX
- #557d73
- RGB
- rgb(85 125 115)
- HSL
- hsl(165 19% 41%)
- HWB
- hwb(165 33% 51%)
- OKLCH
- oklch(0.557 0.047 177.1)
- OKLab
- oklab(0.557 -0.047 0.002)
- CIE Lab
- lab(49.21 -16.33 0.76)
- LCH
- lch(49.21 16.35 177.3)
- CMYK
- cmyk(32% 0% 8% 51%)
Tints · Shades · Tones
Tints
- 658980
- 76968D
- 86A29B
- 97AFA9
- A8BCB6
- B9C9C5
- CAD6D3
- DCE4E1
- EDF1F0
Shades
- 496C63
- 3D5B54
- 314B45
- 263B36
- 1C2C28
- 111E1B
- 08110F
- 020505
- 000101
Tones
- 5A7D74
- 5E7E76
- 637E77
- 677E78
- 6C7F79
- 707F7B
- 747F7C
- 78807D
- 7C807F
Color harmonies
Complementary +180°
- 557D73
Dull Turquoise
- 8B6874
≈ Plum Dandy
Analogous -30° +30°
- 557D73
Dull Turquoise
- 617B64
≈ Swanndri
- 527C82
≈ Labradorite Green
Triadic +120° +240°
- 557D73
Dull Turquoise
- 766E8C
≈ Purple Silhouette
- 896D58
≈ Antiquities
Split-complementary +150° +210°
- 557D73
Dull Turquoise
- 836A82
≈ Parma Grey
- 8D6965
≈ Western Clay
Tetradic +90° +180° +270°
- 557D73
Dull Turquoise
- 677390
≈ Niche
- 8B6874
≈ Plum Dandy
- 807254
≈ Becker Gold
Contrast & accessibility
Ag
AAOn white
WCAG 4.59:1 · APCA Lc 72
Ag
AAOn black
WCAG 4.56:1 · APCA Lc 30
Best text color: #FFFFFF
WCAG 4.59:1 (AA) · APCA Lc 72
Contrast pairs
Code snippets
CSS
:root {
--dull-turquoise: #557d73;
--dull-turquoise-rgb: 85 125 115;
--dull-turquoise-oklch: oklch(0.557 0.047 177.1);
}
.element {
color: var(--dull-turquoise);
background-color: hsl(165 19% 41%);
border-color: oklch(0.557 0.047 177.1);
}Tailwind CSS v4
@theme {
--color-dull-turquoise: #557d73;
--color-dull-turquoise-50: #e8faf5;
--color-dull-turquoise-100: #d8ede8;
--color-dull-turquoise-200: #c0dbd4;
--color-dull-turquoise-300: #9ec0b8;
--color-dull-turquoise-400: #81a89e;
--color-dull-turquoise-500: #649186;
--color-dull-turquoise-600: #557b71;
--color-dull-turquoise-700: #44625a;
--color-dull-turquoise-800: #314841;
--color-dull-turquoise-900: #21322d;
--color-dull-turquoise-950: #101e1a;
}SCSS
$dull-turquoise: #557d73;
$dull-turquoise-rgb: 85, 125, 115;
$dull-turquoise-light: mix(#fff, $dull-turquoise, 20%);
$dull-turquoise-dark: mix(#000, $dull-turquoise, 20%);
.element {
color: $dull-turquoise;
box-shadow: 0 0 0 2px rgba($dull-turquoise, 0.35);
}