Cor nomeada · #C5D4CD
Nature’s Reflection
Nature’s Reflection é #C5D4CD: rgb(197 212 205), hsl(152 15% 80%), oklch(0.857 0.019 166.3). Veja tons claros, sombras, harmonias, contraste WCAG e APCA e código CSS, Tailwind v4 e SCSS.
What does Gray mean? → · Nature’s Reflection color name →
#C5D4CD
oklch(0.857 0.019 166.3)
Conversões de cor
- HEX
- #c5d4cd
- RGB
- rgb(197 212 205)
- HSL
- hsl(152 15% 80%)
- HWB
- hwb(152 77% 17%)
- OKLCH
- oklch(0.857 0.019 166.3)
- OKLab
- oklab(0.857 -0.018 0.004)
- CIE Lab
- lab(83.61 -6.23 1.64)
- LCH
- lch(83.61 6.45 165.3)
- CMYK
- cmyk(7% 0% 3% 17%)
Tons claros · Sombras · Tons
Tons claros
- CBD8D2
- D0DCD7
- D6E1DC
- DCE5E1
- E2E9E6
- E8EEEB
- EDF2F0
- F3F6F5
- F9FBFA
Sombras
- ABB8B2
- 929D98
- 79837E
- 616966
- 4B514E
- 353A38
- 212423
- 0E100F
- 020202
Tons
- BECBC5
- B7C3BD
- B0BAB5
- A9B1AD
- A2A9A6
- 9BA19E
- 949896
- 8D908F
- 878887
Harmonias de cor
Complementar +180°
- C5D4CD
Nature’s Reflection
- DACBD2
≈ Blush of Hyacinth
Análoga -30° +30°
- C5D4CD
Nature’s Reflection
- CAD3C7
≈ Parakeet Pete
- C3D4D4
≈ Scandinavian Sky
Tríade +120° +240°
- C5D4CD
Nature’s Reflection
- CECEDC
≈ Lavender Sparkle
- DBCCC6
≈ Raspberry Ice
Complementar dividida +150° +210°
- C5D4CD
Nature’s Reflection
- D5CCD8
≈ Purple Cream
- DCCBCB
≈ Delirious Donkey
Tétrade +90° +180° +270°
- C5D4CD
Nature’s Reflection
- C8D1DC
≈ Memory Lane
- DACBD2
≈ Blush of Hyacinth
- D7CEC3
≈ Granite Dust
Contraste e acessibilidade
Ag
FailSobre branco
WCAG 1.53:1 · APCA Lc 25
Ag
AAASobre preto
WCAG 13.67:1 · APCA Lc 78
Melhor cor de texto: #000000
WCAG 13.67:1 (AAA) · APCA Lc 78
Contrast pairs
Trechos de código
CSS
:root {
--nature-s-reflection: #c5d4cd;
--nature-s-reflection-rgb: 197 212 205;
--nature-s-reflection-oklch: oklch(0.857 0.019 166.3);
}
.element {
color: var(--nature-s-reflection);
background-color: hsl(152 15% 80%);
border-color: oklch(0.857 0.019 166.3);
}Tailwind CSS v4
@theme {
--color-nature-s-reflection: #c5d4cd;
--color-nature-s-reflection-50: #f0f7f4;
--color-nature-s-reflection-100: #e2eae7;
--color-nature-s-reflection-200: #cdd7d3;
--color-nature-s-reflection-300: #afbbb5;
--color-nature-s-reflection-400: #95a29c;
--color-nature-s-reflection-500: #7b8a83;
--color-nature-s-reflection-600: #68756f;
--color-nature-s-reflection-700: #535e59;
--color-nature-s-reflection-800: #3d4541;
--color-nature-s-reflection-900: #2a2f2d;
--color-nature-s-reflection-950: #171c1a;
}SCSS
$nature-s-reflection: #c5d4cd;
$nature-s-reflection-rgb: 197, 212, 205;
$nature-s-reflection-light: mix(#fff, $nature-s-reflection, 20%);
$nature-s-reflection-dark: mix(#000, $nature-s-reflection, 20%);
.element {
color: $nature-s-reflection;
box-shadow: 0 0 0 2px rgba($nature-s-reflection, 0.35);
}