Nazwany kolor · #8D725A
Cocoa Delight
Cocoa Delight to #8D725A: rgb(141 114 90), hsl(28 22% 45%), oklch(0.572 0.049 63.2). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Brown mean? → · Cocoa Delight color name →
#8D725A
oklch(0.572 0.049 63.2)
Konwersje koloru
- HEX
- #8d725a
- RGB
- rgb(141 114 90)
- HSL
- hsl(28 22% 45%)
- HWB
- hwb(28 35% 45%)
- OKLCH
- oklch(0.572 0.049 63.2)
- OKLab
- oklab(0.572 0.022 0.044)
- CIE Lab
- lab(50.23 8.31 17.55)
- LCH
- lch(50.23 19.42 64.7)
- CMYK
- cmyk(0% 19% 36% 45%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- 987F69
- A38D79
- AE9A89
- BAA899
- C5B6AA
- D0C4BA
- DCD3CB
- E8E1DC
- F3F0ED
Odcienie ciemniejsze
- 7A624D
- 675341
- 554435
- 443629
- 33281E
- 231B13
- 140E09
- 070403
- 010100
Tony
- 8C735E
- 8B7562
- 897666
- 88786A
- 87796D
- 867B71
- 847C75
- 837D79
- 817F7C
Harmonie kolorów
Komplementarna +180°
- 8D725A
Cocoa Delight
- 5F7C93
≈ Provincial Blue
Analogowa -30° +30°
- 8D725A
Cocoa Delight
- 926E65
≈ Prairie Dog
- 827857
≈ Olive Ochre
Triada +120° +240°
- 8D725A
Cocoa Delight
- 57827B
≈ Hanging Moss
- 7E7190
≈ Provence Violet
Komplementarna rozszczepiona +150° +210°
- 8D725A
Cocoa Delight
- 558089
≈ Cape Lee
- 6E7695
≈ Lavender Mauve
Tetrada +90° +180° +270°
- 8D725A
Cocoa Delight
- 62816A
≈ Jadite
- 5F7C93
≈ Provincial Blue
- 8A6D84
≈ Purple Grey
Kontrast i dostępność
Ag
FailNa bieli
WCAG 4.48:1 · APCA Lc 71
Ag
AANa czerni
WCAG 4.68:1 · APCA Lc 31
Najlepszy kolor tekstu: #000000
WCAG 4.68:1 (AA) · APCA Lc 31
Contrast pairs
Fragmenty kodu
CSS
:root {
--cocoa-delight: #8d725a;
--cocoa-delight-rgb: 141 114 90;
--cocoa-delight-oklch: oklch(0.572 0.049 63.2);
}
.element {
color: var(--cocoa-delight);
background-color: hsl(28 22% 45%);
border-color: oklch(0.572 0.049 63.2);
}Tailwind CSS v4
@theme {
--color-cocoa-delight: #8d725a;
--color-cocoa-delight-50: #fff3e7;
--color-cocoa-delight-100: #f4e5d7;
--color-cocoa-delight-200: #e3d1bf;
--color-cocoa-delight-300: #c9b39e;
--color-cocoa-delight-400: #b49981;
--color-cocoa-delight-500: #9e8065;
--color-cocoa-delight-600: #856c55;
--color-cocoa-delight-700: #6b5644;
--color-cocoa-delight-800: #4f3f31;
--color-cocoa-delight-900: #372b21;
--color-cocoa-delight-950: #221811;
}SCSS
$cocoa-delight: #8d725a;
$cocoa-delight-rgb: 141, 114, 90;
$cocoa-delight-light: mix(#fff, $cocoa-delight, 20%);
$cocoa-delight-dark: mix(#000, $cocoa-delight, 20%);
.element {
color: $cocoa-delight;
box-shadow: 0 0 0 2px rgba($cocoa-delight, 0.35);
}