Color con nombre · #CED9DD
Hinting Blue
Hinting Blue es #CED9DD: rgb(206 217 221), hsl(196 18% 84%), oklch(0.878 0.013 221.4). Mira tintes, sombras, armonías, contraste WCAG y APCA, y código CSS, Tailwind v4 y SCSS.
What does Gray mean? → · Hinting Blue color name →
#CED9DD
oklch(0.878 0.013 221.4)
Conversiones de color
- HEX
- #ced9dd
- RGB
- rgb(206 217 221)
- HSL
- hsl(196 18% 84%)
- HWB
- hwb(196 81% 13%)
- OKLCH
- oklch(0.878 0.013 221.4)
- OKLab
- oklab(0.878 -0.01 -0.009)
- CIE Lab
- lab(85.94 -3.27 -3.33)
- LCH
- lch(85.94 4.67 225.5)
- CMYK
- cmyk(7% 2% 0% 13%)
Tintes · Sombras · Tonos
Tintes
- D3DDE0
- D8E1E4
- DDE4E7
- E1E8EB
- E6ECEE
- EBF0F1
- F0F3F5
- F5F7F8
- FAFBFC
Sombras
- B3BCC0
- 98A1A4
- 7F8688
- 666C6E
- 4E5355
- 383B3D
- 232526
- 0F1111
- 020202
Tonos
- C6D0D3
- BEC7CA
- B6BDC0
- AEB4B7
- A6ABAD
- 9EA3A4
- 979A9B
- 8F9192
- 878989
Armonías de color
Complementario +180°
- CED9DD
Hinting Blue
- DFD4D0
≈ Light Weathered Hide
Análogo -30° +30°
- CED9DD
Hinting Blue
- CEDAD9
≈ Light Detroit
- D1D8DF
≈ Reserved Blue
Triádico +120° +240°
- CED9DD
Hinting Blue
- DDD4D9
≈ Fairy White
- D8D7CE
≈ Vaporous Grey
Complementario dividido +150° +210°
- CED9DD
Hinting Blue
- DFD3D4
≈ Pearl Rose
- DCD6CE
≈ Silent Smoke
Tetrádico +90° +180° +270°
Contraste y accesibilidad
Ag
FailSobre blanco
WCAG 1.43:1 · APCA Lc 21
Ag
AAASobre negro
WCAG 14.59:1 · APCA Lc 82
Mejor color de texto: #000000
WCAG 14.59:1 (AAA) · APCA Lc 82
Contrast pairs
Fragmentos de código
CSS
:root {
--hinting-blue: #ced9dd;
--hinting-blue-rgb: 206 217 221;
--hinting-blue-oklch: oklch(0.878 0.013 221.4);
}
.element {
color: var(--hinting-blue);
background-color: hsl(196 18% 84%);
border-color: oklch(0.878 0.013 221.4);
}Tailwind CSS v4
@theme {
--color-hinting-blue: #ced9dd;
--color-hinting-blue-50: #f1f6f8;
--color-hinting-blue-100: #e3e9eb;
--color-hinting-blue-200: #cfd6d8;
--color-hinting-blue-300: #b1b9bc;
--color-hinting-blue-400: #96a0a4;
--color-hinting-blue-500: #7d888c;
--color-hinting-blue-600: #6a7377;
--color-hinting-blue-700: #555c5f;
--color-hinting-blue-800: #3e4445;
--color-hinting-blue-900: #2a2f30;
--color-hinting-blue-950: #181b1c;
}SCSS
$hinting-blue: #ced9dd;
$hinting-blue-rgb: 206, 217, 221;
$hinting-blue-light: mix(#fff, $hinting-blue, 20%);
$hinting-blue-dark: mix(#000, $hinting-blue, 20%);
.element {
color: $hinting-blue;
box-shadow: 0 0 0 2px rgba($hinting-blue, 0.35);
}