Nazwany kolor · #DDD8C2
Palm Heart Cream
Palm Heart Cream to #DDD8C2: rgb(221 216 194), hsl(49 28% 81%), oklch(0.88 0.03 96.4). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Gray mean? → · Palm Heart Cream color name →
#DDD8C2
oklch(0.88 0.03 96.4)
Konwersje koloru
- HEX
- #ddd8c2
- RGB
- rgb(221 216 194)
- HSL
- hsl(49 28% 81%)
- HWB
- hwb(49 76% 13%)
- OKLCH
- oklch(0.88 0.03 96.4)
- OKLab
- oklab(0.88 -0.003 0.03)
- CIE Lab
- lab(86.3 -0.98 11.54)
- LCH
- lch(86.3 11.58 94.9)
- CMYK
- cmyk(0% 2% 12% 13%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- E0DCC8
- E4E0CE
- E7E4D4
- EAE8DA
- EEEBE0
- F1EFE6
- F5F3ED
- F8F7F3
- FCFBF9
Odcienie ciemniejsze
- C0BCA8
- A4A08F
- 888577
- 6E6B60
- 555349
- 3D3B34
- 262520
- 11110E
- 020202
Tony
- D3CFBB
- CAC6B4
- C0BDAE
- B7B4A7
- ADABA1
- A4A29A
- 9B9A93
- 92918D
- 898886
Harmonie kolorów
Komplementarna +180°
- DDD8C2
Palm Heart Cream
- D2D6EC
≈ Light Powdered Granite
Analogowa -30° +30°
- DDD8C2
Palm Heart Cream
- E6D4C3
≈ Silver Thistle Beige
- D2DCC7
≈ Duchamp Light Green
Triada +120° +240°
- DDD8C2
Palm Heart Cream
- C2DDE4
≈ Washing Powder White
- E5D0DF
≈ Summer Clover
Komplementarna rozszczepiona +150° +210°
- DDD8C2
Palm Heart Cream
- C8DAEB
≈ Arctic Rain
- DCD3E8
≈ Teary Eyed
Tetrada +90° +180° +270°
- DDD8C2
Palm Heart Cream
- C3DEDB
≈ Cold Air Turquoise
- D2D6EC
≈ Light Powdered Granite
- EAD0D4
≈ Pink Pail
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.43:1 · APCA Lc 21
Ag
AAANa czerni
WCAG 14.67:1 · APCA Lc 83
Najlepszy kolor tekstu: #000000
WCAG 14.67:1 (AAA) · APCA Lc 83
Contrast pairs
Fragmenty kodu
CSS
:root {
--palm-heart-cream: #ddd8c2;
--palm-heart-cream-rgb: 221 216 194;
--palm-heart-cream-oklch: oklch(0.88 0.03 96.4);
}
.element {
color: var(--palm-heart-cream);
background-color: hsl(49 28% 81%);
border-color: oklch(0.88 0.03 96.4);
}Tailwind CSS v4
@theme {
--color-palm-heart-cream: #ddd8c2;
--color-palm-heart-cream-50: #f7f5ec;
--color-palm-heart-cream-100: #eae8dd;
--color-palm-heart-cream-200: #d7d5c6;
--color-palm-heart-cream-300: #bbb8a7;
--color-palm-heart-cream-400: #a39f8b;
--color-palm-heart-cream-500: #8c8770;
--color-palm-heart-cream-600: #76725f;
--color-palm-heart-cream-700: #5f5b4c;
--color-palm-heart-cream-800: #464237;
--color-palm-heart-cream-900: #302e25;
--color-palm-heart-cream-950: #1c1b14;
}SCSS
$palm-heart-cream: #ddd8c2;
$palm-heart-cream-rgb: 221, 216, 194;
$palm-heart-cream-light: mix(#fff, $palm-heart-cream, 20%);
$palm-heart-cream-dark: mix(#000, $palm-heart-cream, 20%);
.element {
color: $palm-heart-cream;
box-shadow: 0 0 0 2px rgba($palm-heart-cream, 0.35);
}