Benannte Farbe · #96D1C3
Opal Turquoise
Opal Turquoise ist #96D1C3: rgb(150 209 195), hsl(166 39% 70%), oklch(0.816 0.064 178.3). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Teal mean? → · Opal Turquoise color name →
#96D1C3
oklch(0.816 0.064 178.3)
Farbumrechnungen
- HEX
- #96d1c3
- RGB
- rgb(150 209 195)
- HSL
- hsl(166 39% 70%)
- HWB
- hwb(166 59% 18%)
- OKLCH
- oklch(0.816 0.064 178.3)
- OKLab
- oklab(0.816 -0.064 0.002)
- CIE Lab
- lab(79.5 -21.92 0.55)
- LCH
- lch(79.5 21.92 178.6)
- CMYK
- cmyk(28% 0% 7% 18%)
Tints · Shades · Tones
Tints
- A1D6C9
- ACDACF
- B6DFD5
- C1E3DB
- CBE8E1
- D6EDE7
- E0F1ED
- EAF6F3
- F5FAF9
Shades
- 82B5A9
- 6E9B90
- 5B8178
- 496860
- 37504A
- 263934
- 162320
- 08100E
- 010202
Tones
- 94C9BC
- 93C0B5
- 91B8AE
- 8FB0A8
- 8CA8A1
- 8AA09A
- 889894
- 85908D
- 838886
Farbharmonien
Komplementär +180°
- 96D1C3
Opal Turquoise
- E6B2C2
≈ Athena Pink
Analog -30° +30°
- 96D1C3
Opal Turquoise
- A8CFAC
≈ Mint Circle
- 92CFD9
≈ Winter Chill
Triadisch +120° +240°
- 96D1C3
Opal Turquoise
- C8BBE7
≈ Drifting Dream
- E3B99B
≈ Sumptuous Peach
Geteilt komplementär +150° +210°
- 96D1C3
Opal Turquoise
- DAB5D8
≈ French Lilac
- EAB4AC
≈ Pensive Pink
Tetradisch +90° +180° +270°
- 96D1C3
Opal Turquoise
- B1C2ED
≈ Larkspur Bud
- E6B2C2
≈ Athena Pink
- D4C194
≈ Cache of Camel
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 1.72:1 · APCA Lc 31
Ag
AAAAuf Schwarz
WCAG 12.20:1 · APCA Lc 72
Beste Textfarbe: #000000
WCAG 12.20:1 (AAA) · APCA Lc 72
Contrast pairs
Code-Snippets
CSS
:root {
--opal-turquoise: #96d1c3;
--opal-turquoise-rgb: 150 209 195;
--opal-turquoise-oklch: oklch(0.816 0.064 178.3);
}
.element {
color: var(--opal-turquoise);
background-color: hsl(166 39% 70%);
border-color: oklch(0.816 0.064 178.3);
}Tailwind CSS v4
@theme {
--color-opal-turquoise: #96d1c3;
--color-opal-turquoise-50: #e3fcf6;
--color-opal-turquoise-100: #d2efe9;
--color-opal-turquoise-200: #b8ded5;
--color-opal-turquoise-300: #94c3b9;
--color-opal-turquoise-400: #75ab9e;
--color-opal-turquoise-500: #549486;
--color-opal-turquoise-600: #487d72;
--color-opal-turquoise-700: #39645b;
--color-opal-turquoise-800: #294a42;
--color-opal-turquoise-900: #1b332d;
--color-opal-turquoise-950: #0b1f1a;
}SCSS
$opal-turquoise: #96d1c3;
$opal-turquoise-rgb: 150, 209, 195;
$opal-turquoise-light: mix(#fff, $opal-turquoise, 20%);
$opal-turquoise-dark: mix(#000, $opal-turquoise, 20%);
.element {
color: $opal-turquoise;
box-shadow: 0 0 0 2px rgba($opal-turquoise, 0.35);
}