Cor nomeada · #B3C6B9
Pine Whisper
Pine Whisper é #B3C6B9: rgb(179 198 185), hsl(139 14% 74%), oklch(0.808 0.027 155.8). Veja tons claros, sombras, harmonias, contraste WCAG e APCA e código CSS, Tailwind v4 e SCSS.
What does Gray mean? → · Pine Whisper color name →
#B3C6B9
oklch(0.808 0.027 155.8)
Conversões de cor
- 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%)
Tons claros · Sombras · Tons
Tons claros
- BACCC0
- C2D1C7
- C9D7CE
- D1DDD5
- D9E2DC
- E0E8E3
- E8EEEA
- F0F3F1
- F7F9F8
Sombras
- 9BACA0
- 849289
- 6E7A71
- 58625B
- 434B46
- 2F3531
- 1D211E
- 0C0E0D
- 010202
Tons
- AEBFB3
- A9B8AD
- A3B0A8
- 9EA9A2
- 99A29C
- 949B96
- 8F9491
- 8A8E8B
- 858786
Harmonias de cor
Complementar +180°
- B3C6B9
Pine Whisper
- CCBAC7
≈ Queen’s Violet
Análoga -30° +30°
- B3C6B9
Pine Whisper
- BCC4B1
≈ Komorebi
- AEC7C3
≈ Crystal Oasis
Tríade +120° +240°
- B3C6B9
Pine Whisper
- BBBFD3
≈ Sweet Juliet
- D1BBB4
≈ Forever Fairytale
Complementar dividida +150° +210°
- B3C6B9
Pine Whisper
- C5BCCF
≈ Purpling Dawn
- D1B9BE
≈ Blobfish
Tétrade +90° +180° +270°
- B3C6B9
Pine Whisper
- B2C3D1
≈ Hazy
- CCBAC7
≈ Queen’s Violet
- CDBDAE
≈ Mesa Tumbleweed
Contraste e acessibilidade
Ag
FailSobre branco
WCAG 1.79:1 · APCA Lc 33
Ag
AAASobre preto
WCAG 11.69:1 · APCA Lc 69
Melhor cor de texto: #000000
WCAG 11.69:1 (AAA) · APCA Lc 69
Contrast pairs
Trechos de código
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);
}