Benannte Farbe · #53C2C3
Gem Turquoise
Gem Turquoise ist #53C2C3: rgb(83 194 195), hsl(181 48% 55%), oklch(0.751 0.1 196). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Teal mean? → · Gem Turquoise color name →
#53C2C3
oklch(0.751 0.1 196)
Farbumrechnungen
- HEX
- #53c2c3
- RGB
- rgb(83 194 195)
- HSL
- hsl(181 48% 55%)
- HWB
- hwb(181 33% 24%)
- OKLCH
- oklch(0.751 0.1 196)
- OKLab
- oklab(0.751 -0.096 -0.028)
- CIE Lab
- lab(72.17 -32.58 -10.58)
- LCH
- lch(72.17 34.25 198)
- CMYK
- cmyk(57% 1% 0% 24%)
Tints · Shades · Tones
Tints
- 69C8C9
- 7CCECF
- 8ED5D5
- A0DBDB
- B0E1E1
- C0E7E7
- D0EDED
- E0F3F3
- F0F9F9
Shades
- 47A8A9
- 3B8F90
- 307778
- 256060
- 1B494A
- 113434
- 082020
- 020E0E
- 000202
Tones
- 5CBBBC
- 63B5B5
- 69AEAE
- 6EA8A8
- 72A1A1
- 769A9A
- 799494
- 7C8D8D
- 7E8787
Farbharmonien
Komplementär +180°
- 53C2C3
Gem Turquoise
- E79498
≈ Marker Pink
Analog -30° +30°
- 53C2C3
Gem Turquoise
- 6AC3A0
≈ Gem Silica
- 61BBDF
≈ Clear Weather
Triadisch +120° +240°
- 53C2C3
Gem Turquoise
- C79BD9
≈ Mauve Mist
- D3A662
≈ Burnside
Geteilt komplementär +150° +210°
- 53C2C3
Gem Turquoise
- DD94BC
≈ Firm Pink
- E39A77
≈ Trumpet Flower
Tetradisch +90° +180° +270°
- 53C2C3
Gem Turquoise
- A9A5EB
≈ Maximum Blue Purple
- E79498
≈ Marker Pink
- B6B264
≈ Summer Moss
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 2.12:1 · APCA Lc 41
Ag
AAAAuf Schwarz
WCAG 9.87:1 · APCA Lc 61
Beste Textfarbe: #000000
WCAG 9.87:1 (AAA) · APCA Lc 61
Contrast pairs
Code-Snippets
CSS
:root {
--gem-turquoise: #53c2c3;
--gem-turquoise-rgb: 83 194 195;
--gem-turquoise-oklch: oklch(0.751 0.1 196);
}
.element {
color: var(--gem-turquoise);
background-color: hsl(181 48% 55%);
border-color: oklch(0.751 0.1 196);
}Tailwind CSS v4
@theme {
--color-gem-turquoise: #53c2c3;
--color-gem-turquoise-50: #d5ffff;
--color-gem-turquoise-100: #c2f3f4;
--color-gem-turquoise-200: #a1e2e4;
--color-gem-turquoise-300: #76c8ca;
--color-gem-turquoise-400: #48b1b2;
--color-gem-turquoise-500: #009a9c;
--color-gem-turquoise-600: #008284;
--color-gem-turquoise-700: #00686a;
--color-gem-turquoise-800: #004d4c;
--color-gem-turquoise-900: #023635;
--color-gem-turquoise-950: #002120;
}SCSS
$gem-turquoise: #53c2c3;
$gem-turquoise-rgb: 83, 194, 195;
$gem-turquoise-light: mix(#fff, $gem-turquoise, 20%);
$gem-turquoise-dark: mix(#000, $gem-turquoise, 20%);
.element {
color: $gem-turquoise;
box-shadow: 0 0 0 2px rgba($gem-turquoise, 0.35);
}