Color con nombre · #D4CAC5
Crushed Almond
Crushed Almond es #D4CAC5: rgb(212 202 197), hsl(20 15% 80%), oklch(0.846 0.013 48.6). Mira tintes, sombras, armonías, contraste WCAG y APCA, y código CSS, Tailwind v4 y SCSS.
What does Gray mean? → · Crushed Almond color name →
#D4CAC5
oklch(0.846 0.013 48.6)
Conversiones de color
- HEX
- #d4cac5
- RGB
- rgb(212 202 197)
- HSL
- hsl(20 15% 80%)
- HWB
- hwb(20 77% 17%)
- OKLCH
- oklch(0.846 0.013 48.6)
- OKLab
- oklab(0.846 0.009 0.01)
- CIE Lab
- lab(82.04 2.95 3.81)
- LCH
- lch(82.04 4.82 52.3)
- CMYK
- cmyk(0% 5% 7% 17%)
Tintes · Sombras · Tonos
Tintes
- D8CFCB
- DDD4D0
- E1DAD6
- E5DFDC
- E9E4E2
- EEEAE7
- F2EFED
- F6F4F3
- FBFAF9
Sombras
- B8AFAB
- 9D9592
- 837C79
- 696461
- 514D4B
- 3A3735
- 242221
- 100F0E
- 020202
Tonos
- CBC2BE
- C3BBB7
- BAB3B0
- B2ACA9
- A9A4A2
- A19D9B
- 989694
- 908E8D
- 888787
Armonías de color
Complementario +180°
- D4CAC5
Crushed Almond
- C4CED3
≈ Lark Wing
Análogo -30° +30°
- D4CAC5
Crushed Almond
- D5C9C9
≈ Grey Lilac
- D1CBC3
≈ Cotton Grey
Triádico +120° +240°
- D4CAC5
Crushed Almond
- C5CFCB
≈ Luna Light
- CCCBD5
≈ Lilac Hint
Complementario dividido +150° +210°
- D4CAC5
Crushed Almond
- C3CFCF
≈ Tudor Ice
- C7CDD5
≈ Ephemeral Mist
Tetrádico +90° +180° +270°
- D4CAC5
Crushed Almond
- C8CEC6
≈ Murmur
- C4CED3
≈ Lark Wing
- D0CAD2
≈ Orchid Tint
Contraste y accesibilidad
Ag
FailSobre blanco
WCAG 1.60:1 · APCA Lc 27
Ag
AAASobre negro
WCAG 13.05:1 · APCA Lc 76
Mejor color de texto: #000000
WCAG 13.05:1 (AAA) · APCA Lc 76
Contrast pairs
Fragmentos de código
CSS
:root {
--crushed-almond: #d4cac5;
--crushed-almond-rgb: 212 202 197;
--crushed-almond-oklch: oklch(0.846 0.013 48.6);
}
.element {
color: var(--crushed-almond);
background-color: hsl(20 15% 80%);
border-color: oklch(0.846 0.013 48.6);
}Tailwind CSS v4
@theme {
--color-crushed-almond: #d4cac5;
--color-crushed-almond-50: #f8f4f2;
--color-crushed-almond-100: #ece7e4;
--color-crushed-almond-200: #d9d3cf;
--color-crushed-almond-300: #bdb6b1;
--color-crushed-almond-400: #a59c98;
--color-crushed-almond-500: #8e847f;
--color-crushed-almond-600: #78706b;
--color-crushed-almond-700: #605956;
--color-crushed-almond-800: #46413f;
--color-crushed-almond-900: #312d2b;
--color-crushed-almond-950: #1d1a18;
}SCSS
$crushed-almond: #d4cac5;
$crushed-almond-rgb: 212, 202, 197;
$crushed-almond-light: mix(#fff, $crushed-almond, 20%);
$crushed-almond-dark: mix(#000, $crushed-almond, 20%);
.element {
color: $crushed-almond;
box-shadow: 0 0 0 2px rgba($crushed-almond, 0.35);
}