Benannte Farbe · #B3C6B9
Pine Whisper
Pine Whisper ist #B3C6B9: rgb(179 198 185), hsl(139 14% 74%), oklch(0.808 0.027 155.8). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Gray mean? → · Pine Whisper color name →
#B3C6B9
oklch(0.808 0.027 155.8)
Farbumrechnungen
- HEX
- #b3c6b9
- RGB
- rgb(179 198 185)
- HSL
- hsl(139 14% 74%)
- HWB
- hwb(139 70% 22%)
- OKLCH
- oklch(0.808 0.027 155.8)
- OKLab
- oklab(0.808 -0.025 0.011)
- CIE Lab
- lab(78.14 -8.57 4.22)
- LCH
- lch(78.14 9.55 153.8)
- CMYK
- cmyk(10% 0% 7% 22%)
Tints · Shades · Tones
Tints
- BACCC0
- C2D1C7
- C9D7CE
- D1DDD5
- D9E2DC
- E0E8E3
- E8EEEA
- F0F3F1
- F7F9F8
Shades
- 9BACA0
- 849289
- 6E7A71
- 58625B
- 434B46
- 2F3531
- 1D211E
- 0C0E0D
- 010202
Tones
- AEBFB3
- A9B8AD
- A3B0A8
- 9EA9A2
- 99A29C
- 949B96
- 8F9491
- 8A8E8B
- 858786
Farbharmonien
Komplementär +180°
- B3C6B9
Pine Whisper
- CCBAC7
≈ Queen’s Violet
Analog -30° +30°
- B3C6B9
Pine Whisper
- BCC4B1
≈ Komorebi
- AEC7C3
≈ Crystal Oasis
Triadisch +120° +240°
- B3C6B9
Pine Whisper
- BBBFD3
≈ Sweet Juliet
- D1BBB4
≈ Forever Fairytale
Geteilt komplementär +150° +210°
- B3C6B9
Pine Whisper
- C5BCCF
≈ Purpling Dawn
- D1B9BE
≈ Blobfish
Tetradisch +90° +180° +270°
- B3C6B9
Pine Whisper
- B2C3D1
≈ Hazy
- CCBAC7
≈ Queen’s Violet
- CDBDAE
≈ Mesa Tumbleweed
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 1.79:1 · APCA Lc 33
Ag
AAAAuf Schwarz
WCAG 11.69:1 · APCA Lc 69
Beste Textfarbe: #000000
WCAG 11.69:1 (AAA) · APCA Lc 69
Contrast pairs
Code-Snippets
CSS
:root {
--pine-whisper: #b3c6b9;
--pine-whisper-rgb: 179 198 185;
--pine-whisper-oklch: oklch(0.808 0.027 155.8);
}
.element {
color: var(--pine-whisper);
background-color: hsl(139 14% 74%);
border-color: oklch(0.808 0.027 155.8);
}Tailwind CSS v4
@theme {
--color-pine-whisper: #b3c6b9;
--color-pine-whisper-50: #eff8f2;
--color-pine-whisper-100: #e1ebe4;
--color-pine-whisper-200: #cbd8d0;
--color-pine-whisper-300: #acbcb2;
--color-pine-whisper-400: #92a498;
--color-pine-whisper-500: #788c7f;
--color-pine-whisper-600: #66766b;
--color-pine-whisper-700: #515f56;
--color-pine-whisper-800: #3b453e;
--color-pine-whisper-900: #29302b;
--color-pine-whisper-950: #171c18;
}SCSS
$pine-whisper: #b3c6b9;
$pine-whisper-rgb: 179, 198, 185;
$pine-whisper-light: mix(#fff, $pine-whisper, 20%);
$pine-whisper-dark: mix(#000, $pine-whisper, 20%);
.element {
color: $pine-whisper;
box-shadow: 0 0 0 2px rgba($pine-whisper, 0.35);
}