Cor nomeada · #DFD6D1
Kyoto Pearl
Kyoto Pearl é #DFD6D1: rgb(223 214 209), hsl(21 18% 85%), oklch(0.882 0.012 51.3). Veja tons claros, sombras, harmonias, contraste WCAG e APCA e código CSS, Tailwind v4 e SCSS.
What does Gray mean? → · Kyoto Pearl color name →
#DFD6D1
oklch(0.882 0.012 51.3)
Conversões de cor
- HEX
- #dfd6d1
- RGB
- rgb(223 214 209)
- HSL
- hsl(21 18% 85%)
- HWB
- hwb(21 82% 13%)
- OKLCH
- oklch(0.882 0.012 51.3)
- OKLab
- oklab(0.882 0.008 0.009)
- CIE Lab
- lab(86.25 2.56 3.64)
- LCH
- lch(86.25 4.44 54.9)
- CMYK
- cmyk(0% 4% 6% 13%)
Tons claros · Sombras · Tons
Tons claros
- E2DAD6
- E5DEDA
- E9E2DF
- ECE6E3
- EFEAE8
- F2EEEC
- F5F3F1
- F9F7F6
- FCFBFA
Sombras
- C2BAB5
- A59E9B
- 8A8481
- 6F6A68
- 565250
- 3D3B39
- 272523
- 121010
- 020202
Tons
- D5CDC9
- CBC4C0
- C2BBB8
- B8B3B0
- AEAAA8
- A5A1A0
- 9B9998
- 929190
- 898888
Harmonias de cor
Complementar +180°
- DFD6D1
Kyoto Pearl
- D1DADF
≈ Zen
Análoga -30° +30°
- DFD6D1
Kyoto Pearl
- E0D5D4
≈ Razzberry Fizz
- DCD7CF
≈ Catacomb Walls
Tríade +120° +240°
- DFD6D1
Kyoto Pearl
- D1DBD7
≈ Morning Fog
- D8D7E0
≈ Violet Whimsey
Complementar dividida +150° +210°
- DFD6D1
Kyoto Pearl
- CFDBDB
≈ Light Detroit
- D4D8E0
≈ Shy Blunt
Tétrade +90° +180° +270°
- DFD6D1
Kyoto Pearl
- D4DAD3
≈ Misty Coast
- D1DADF
≈ Zen
- DCD6DD
≈ Violet Whimsey
Contraste e acessibilidade
Ag
FailSobre branco
WCAG 1.43:1 · APCA Lc 21
Ag
AAASobre preto
WCAG 14.67:1 · APCA Lc 83
Melhor cor de texto: #000000
WCAG 14.67:1 (AAA) · APCA Lc 83
Contrast pairs
Trechos de código
CSS
:root {
--kyoto-pearl: #dfd6d1;
--kyoto-pearl-rgb: 223 214 209;
--kyoto-pearl-oklch: oklch(0.882 0.012 51.3);
}
.element {
color: var(--kyoto-pearl);
background-color: hsl(21 18% 85%);
border-color: oklch(0.882 0.012 51.3);
}Tailwind CSS v4
@theme {
--color-kyoto-pearl: #dfd6d1;
--color-kyoto-pearl-50: #f8f4f2;
--color-kyoto-pearl-100: #ebe7e4;
--color-kyoto-pearl-200: #d9d3cf;
--color-kyoto-pearl-300: #bdb6b2;
--color-kyoto-pearl-400: #a59d98;
--color-kyoto-pearl-500: #8d847f;
--color-kyoto-pearl-600: #77706c;
--color-kyoto-pearl-700: #5f5956;
--color-kyoto-pearl-800: #46413f;
--color-kyoto-pearl-900: #302d2b;
--color-kyoto-pearl-950: #1d1a18;
}SCSS
$kyoto-pearl: #dfd6d1;
$kyoto-pearl-rgb: 223, 214, 209;
$kyoto-pearl-light: mix(#fff, $kyoto-pearl, 20%);
$kyoto-pearl-dark: mix(#000, $kyoto-pearl, 20%);
.element {
color: $kyoto-pearl;
box-shadow: 0 0 0 2px rgba($kyoto-pearl, 0.35);
}