Benannte Farbe · #9BC4D4
June
June ist #9BC4D4: rgb(155 196 212), hsl(197 40% 72%), oklch(0.796 0.049 223.7). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Cyan mean? → · June color name →
#9BC4D4
oklch(0.796 0.049 223.7)
Farbumrechnungen
- HEX
- #9bc4d4
- RGB
- rgb(155 196 212)
- HSL
- hsl(197 40% 72%)
- HWB
- hwb(197 61% 17%)
- OKLCH
- oklch(0.796 0.049 223.7)
- OKLab
- oklab(0.796 -0.035 -0.034)
- CIE Lab
- lab(76.59 -11.35 -12.74)
- LCH
- lch(76.59 17.06 228.3)
- CMYK
- cmyk(27% 8% 0% 17%)
Tints · Shades · Tones
Tints
- A5CAD8
- AFD0DD
- B9D6E1
- C3DBE5
- CDE1EA
- D7E7EE
- E1EDF2
- EBF3F6
- F5F9FB
Shades
- 86AAB8
- 72919D
- 5E7883
- 4B6169
- 394A51
- 28353A
- 182124
- 090E10
- 010202
Tones
- 99BDCB
- 96B6C3
- 93AFBA
- 91A8B2
- 8EA1A9
- 8B9BA1
- 899498
- 868D90
- 838788
Farbharmonien
Komplementär +180°
- 9BC4D4
June
- D9B3A3
≈ Cinnamon Whip
Analog -30° +30°
Triadisch +120° +240°
- 9BC4D4
June
- D4B0C4
≈ Tranquil Dusk
- C1BF9A
≈ Esprit
Geteilt komplementär +150° +210°
- 9BC4D4
June
- DAB0B3
≈ Radiant Rouge
- D0B89A
≈ Cosy Wool
Tetradisch +90° +180° +270°
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 1.86:1 · APCA Lc 35
Ag
AAAAuf Schwarz
WCAG 11.24:1 · APCA Lc 67
Beste Textfarbe: #000000
WCAG 11.24:1 (AAA) · APCA Lc 67
Contrast pairs
Code-Snippets
CSS
:root {
--june: #9bc4d4;
--june-rgb: 155 196 212;
--june-oklch: oklch(0.796 0.049 223.7);
}
.element {
color: var(--june);
background-color: hsl(197 40% 72%);
border-color: oklch(0.796 0.049 223.7);
}Tailwind CSS v4
@theme {
--color-june: #9bc4d4;
--color-june-50: #e7f8ff;
--color-june-100: #d8ecf5;
--color-june-200: #bfd9e4;
--color-june-300: #9ebdcb;
--color-june-400: #7fa5b4;
--color-june-500: #628e9e;
--color-june-600: #537886;
--color-june-700: #42606b;
--color-june-800: #2f464f;
--color-june-900: #203137;
--color-june-950: #0f1d22;
}SCSS
$june: #9bc4d4;
$june-rgb: 155, 196, 212;
$june-light: mix(#fff, $june, 20%);
$june-dark: mix(#000, $june, 20%);
.element {
color: $june;
box-shadow: 0 0 0 2px rgba($june, 0.35);
}