Nächste benannte Farbe · #63D8CE
#63D8CE
Nächste benannte Farbe: Hammam Blue
#63D8CE (rgb(99 216 206), hsl(175 60% 62%), oklch(0.812 0.107 187.7)) liegt am nächsten an der benannten Farbe Hammam Blue. Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
#63D8CE
oklch(0.812 0.107 187.7)
Farbumrechnungen
- HEX
- #63d8ce
- RGB
- rgb(99 216 206)
- HSL
- hsl(175 60% 62%)
- HWB
- hwb(175 39% 15%)
- OKLCH
- oklch(0.812 0.107 187.7)
- OKLab
- oklab(0.812 -0.106 -0.014)
- CIE Lab
- lab(79.47 -36.38 -5.67)
- LCH
- lch(79.47 36.82 188.9)
- CMYK
- cmyk(54% 0% 5% 15%)
Tints · Shades · Tones
Tints
- 77DCD3
- 89E0D8
- 9AE4DD
- A9E8E1
- B8ECE6
- C7F0EB
- D5F4F0
- E3F8F5
- F1FBFA
Shades
- 55BCB3
- 47A098
- 3A857F
- 2E6B66
- 21534E
- 163B38
- 0B2523
- 03110F
- 000202
Tones
- 6ACFC6
- 6FC6BE
- 73BDB6
- 77B4AE
- 7AACA6
- 7CA39E
- 7E9A97
- 7F918F
- 808987
Farbharmonien
Komplementär +180°
- 63D8CE
Hammam Blue
- FDA4B5
≈ Ballet Slippers
Analog -30° +30°
- 63D8CE
Hammam Blue
- 83D7A7
≈ Fresco Green
- 66D2EF
≈ Heisenberg Blue
Triadisch +120° +240°
- 63D8CE
Hammam Blue
- D4AFF7
≈ Teasel Dipsacus
- F0B474
≈ Golden Chime
Geteilt komplementär +150° +210°
- 63D8CE
Hammam Blue
- EFA7DA
≈ Pretty Pink Piggy
- FEA98F
≈ Frozen Salmon
Tetradisch +90° +180° +270°
- 63D8CE
Hammam Blue
- B3BCFF
≈ Dried Lilac
- FDA4B5
≈ Ballet Slippers
- D4C26E
≈ Citrus Yellow
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 1.71:1 · APCA Lc 31
Ag
AAAAuf Schwarz
WCAG 12.24:1 · APCA Lc 72
Beste Textfarbe: #000000
WCAG 12.24:1 (AAA) · APCA Lc 72
Contrast pairs
Code-Snippets
CSS
:root {
--hammam-blue: #63d8ce;
--hammam-blue-rgb: 99 216 206;
--hammam-blue-oklch: oklch(0.812 0.107 187.7);
}
.element {
color: var(--hammam-blue);
background-color: hsl(175 60% 62%);
border-color: oklch(0.812 0.107 187.7);
}Tailwind CSS v4
@theme {
--color-hammam-blue: #63d8ce;
--color-hammam-blue-50: #d3fffc;
--color-hammam-blue-100: #c0f4ef;
--color-hammam-blue-200: #9ee3de;
--color-hammam-blue-300: #71c9c3;
--color-hammam-blue-400: #42b3aa;
--color-hammam-blue-500: #009c93;
--color-hammam-blue-600: #00847c;
--color-hammam-blue-700: #006a63;
--color-hammam-blue-800: #004e48;
--color-hammam-blue-900: #003632;
--color-hammam-blue-950: #00211e;
}SCSS
$hammam-blue: #63d8ce;
$hammam-blue-rgb: 99, 216, 206;
$hammam-blue-light: mix(#fff, $hammam-blue, 20%);
$hammam-blue-dark: mix(#000, $hammam-blue, 20%);
.element {
color: $hammam-blue;
box-shadow: 0 0 0 2px rgba($hammam-blue, 0.35);
}