Nazwany kolor · #D4CAC5
Crushed Almond
Crushed Almond to #D4CAC5: rgb(212 202 197), hsl(20 15% 80%), oklch(0.846 0.013 48.6). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Gray mean? → · Crushed Almond color name →
#D4CAC5
oklch(0.846 0.013 48.6)
Konwersje koloru
- 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%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- D8CFCB
- DDD4D0
- E1DAD6
- E5DFDC
- E9E4E2
- EEEAE7
- F2EFED
- F6F4F3
- FBFAF9
Odcienie ciemniejsze
- B8AFAB
- 9D9592
- 837C79
- 696461
- 514D4B
- 3A3735
- 242221
- 100F0E
- 020202
Tony
- CBC2BE
- C3BBB7
- BAB3B0
- B2ACA9
- A9A4A2
- A19D9B
- 989694
- 908E8D
- 888787
Harmonie kolorów
Komplementarna +180°
- D4CAC5
Crushed Almond
- C4CED3
≈ Lark Wing
Analogowa -30° +30°
- D4CAC5
Crushed Almond
- D5C9C9
≈ Grey Lilac
- D1CBC3
≈ Cotton Grey
Triada +120° +240°
- D4CAC5
Crushed Almond
- C5CFCB
≈ Luna Light
- CCCBD5
≈ Lilac Hint
Komplementarna rozszczepiona +150° +210°
- D4CAC5
Crushed Almond
- C3CFCF
≈ Tudor Ice
- C7CDD5
≈ Ephemeral Mist
Tetrada +90° +180° +270°
- D4CAC5
Crushed Almond
- C8CEC6
≈ Murmur
- C4CED3
≈ Lark Wing
- D0CAD2
≈ Orchid Tint
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.60:1 · APCA Lc 27
Ag
AAANa czerni
WCAG 13.05:1 · APCA Lc 76
Najlepszy kolor tekstu: #000000
WCAG 13.05:1 (AAA) · APCA Lc 76
Contrast pairs
Fragmenty kodu
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);
}