Cor nomeada · #BED3CB
Quaver
Quaver é #BED3CB: rgb(190 211 203), hsl(157 19% 79%), oklch(0.849 0.025 170.9). Veja tons claros, sombras, harmonias, contraste WCAG e APCA e código CSS, Tailwind v4 e SCSS.
What does Gray mean? → · Quaver color name →
#BED3CB
oklch(0.849 0.025 170.9)
Conversões de cor
- HEX
- #bed3cb
- RGB
- rgb(190 211 203)
- HSL
- hsl(157 19% 79%)
- HWB
- hwb(157 75% 17%)
- OKLCH
- oklch(0.849 0.025 170.9)
- OKLab
- oklab(0.849 -0.025 0.004)
- CIE Lab
- lab(82.79 -8.46 1.44)
- LCH
- lch(82.79 8.59 170.3)
- CMYK
- cmyk(10% 0% 4% 17%)
Tons claros · Sombras · Tons
Tons claros
- C4D7D0
- CBDCD5
- D1E0DA
- D8E4E0
- DEE9E5
- E5EDEA
- EBF2EF
- F2F6F4
- F8FBFA
Sombras
- A5B7B0
- 8C9C96
- 75827D
- 5E6965
- 48514D
- 333A37
- 1F2422
- 0D100F
- 020202
Tons
- B8CAC3
- B1C2BC
- ABB9B4
- A5B1AC
- 9FA9A5
- 98A09D
- 929896
- 8C908E
- 868887
Harmonias de cor
Complementar +180°
- BED3CB
Quaver
- DBC7CF
≈ Kellie Belle
Análoga -30° +30°
- BED3CB
Quaver
- C5D2C2
≈ Dewkist
- BBD3D4
≈ Relax
Tríade +120° +240°
- BED3CB
Quaver
- CDCBDD
≈ Lunar Dust
- DCC9BF
≈ Coconut Macaroon
Complementar dividida +150° +210°
- BED3CB
Quaver
- D5C8D8
≈ Shy Violet
- DEC7C6
≈ Pocketful of Promise
Tétrade +90° +180° +270°
Contraste e acessibilidade
Ag
FailSobre branco
WCAG 1.57:1 · APCA Lc 26
Ag
AAASobre preto
WCAG 13.36:1 · APCA Lc 77
Melhor cor de texto: #000000
WCAG 13.36:1 (AAA) · APCA Lc 77
Contrast pairs
Trechos de código
CSS
:root {
--quaver: #bed3cb;
--quaver-rgb: 190 211 203;
--quaver-oklch: oklch(0.849 0.025 170.9);
}
.element {
color: var(--quaver);
background-color: hsl(157 19% 79%);
border-color: oklch(0.849 0.025 170.9);
}Tailwind CSS v4
@theme {
--color-quaver: #bed3cb;
--color-quaver-50: #eef8f4;
--color-quaver-100: #e0ebe7;
--color-quaver-200: #cad8d3;
--color-quaver-300: #abbcb6;
--color-quaver-400: #90a39c;
--color-quaver-500: #768c84;
--color-quaver-600: #647670;
--color-quaver-700: #505f59;
--color-quaver-800: #3a4541;
--color-quaver-900: #28302d;
--color-quaver-950: #161c1a;
}SCSS
$quaver: #bed3cb;
$quaver-rgb: 190, 211, 203;
$quaver-light: mix(#fff, $quaver, 20%);
$quaver-dark: mix(#000, $quaver, 20%);
.element {
color: $quaver;
box-shadow: 0 0 0 2px rgba($quaver, 0.35);
}