Benannte Farbe · #9CC9D4
Soothing Blue
Soothing Blue ist #9CC9D4: rgb(156 201 212), hsl(192 39% 72%), oklch(0.808 0.05 214.3). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Cyan mean? → · Soothing Blue color name →
#9CC9D4
oklch(0.808 0.05 214.3)
Farbumrechnungen
- HEX
- #9cc9d4
- RGB
- rgb(156 201 212)
- HSL
- hsl(192 39% 72%)
- HWB
- hwb(192 61% 17%)
- OKLCH
- oklch(0.808 0.05 214.3)
- OKLab
- oklab(0.808 -0.041 -0.028)
- CIE Lab
- lab(78.03 -13.45 -10.61)
- LCH
- lch(78.03 17.13 218.3)
- CMYK
- cmyk(26% 5% 0% 17%)
Tints · Shades · Tones
Tints
- A6CED8
- B0D4DD
- BAD9E1
- C4DFE5
- CEE4E9
- D7E9EE
- E1EFF2
- EBF4F6
- F5FAFB
Shades
- 87AEB8
- 73959D
- 5F7C83
- 4C6469
- 394C51
- 28363A
- 182224
- 090F10
- 010202
Tones
- 99C1CB
- 97BAC3
- 94B3BA
- 92ABB2
- 8FA4A9
- 8C9DA1
- 899598
- 868E90
- 838788
Farbharmonien
Komplementär +180°
- 9CC9D4
Soothing Blue
- DEB5AB
≈ Evening Sand
Analog -30° +30°
- 9CC9D4
Soothing Blue
- 9DCBC4
≈ Jamaica Bay
- A6C4DF
≈ Utterly Blue
Triadisch +120° +240°
- 9CC9D4
Soothing Blue
- D5B5CD
≈ Pink Power
- CAC09C
≈ Tangled Vines
Geteilt komplementär +150° +210°
- 9CC9D4
Soothing Blue
- DDB3BC
≈ Pentalon
- D8BA9F
≈ Tracery
Tetradisch +90° +180° +270°
- 9CC9D4
Soothing Blue
- C7B9DB
≈ New Love
- DEB5AB
≈ Evening Sand
- B9C6A3
≈ Quaking Grass
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 1.79:1 · APCA Lc 33
Ag
AAAAuf Schwarz
WCAG 11.71:1 · APCA Lc 69
Beste Textfarbe: #000000
WCAG 11.71:1 (AAA) · APCA Lc 69
Contrast pairs
Code-Snippets
CSS
:root {
--soothing-blue: #9cc9d4;
--soothing-blue-rgb: 156 201 212;
--soothing-blue-oklch: oklch(0.808 0.05 214.3);
}
.element {
color: var(--soothing-blue);
background-color: hsl(192 39% 72%);
border-color: oklch(0.808 0.05 214.3);
}Tailwind CSS v4
@theme {
--color-soothing-blue: #9cc9d4;
--color-soothing-blue-50: #e6f9fe;
--color-soothing-blue-100: #d6ecf3;
--color-soothing-blue-200: #bddae2;
--color-soothing-blue-300: #9cbec8;
--color-soothing-blue-400: #7da6b1;
--color-soothing-blue-500: #5f8f9b;
--color-soothing-blue-600: #517983;
--color-soothing-blue-700: #406169;
--color-soothing-blue-800: #2e474c;
--color-soothing-blue-900: #1f3135;
--color-soothing-blue-950: #0e1d20;
}SCSS
$soothing-blue: #9cc9d4;
$soothing-blue-rgb: 156, 201, 212;
$soothing-blue-light: mix(#fff, $soothing-blue, 20%);
$soothing-blue-dark: mix(#000, $soothing-blue, 20%);
.element {
color: $soothing-blue;
box-shadow: 0 0 0 2px rgba($soothing-blue, 0.35);
}