Colore con nome · #875F42
Cocoa
Cocoa è #875F42: rgb(135 95 66), hsl(25 34% 39%), oklch(0.521 0.067 56.6). Scopri tinte, ombre, armonie, contrasto WCAG e APCA e codice CSS, Tailwind v4 e SCSS.
What does Brown mean? → · Cocoa color name →
#875F42
oklch(0.521 0.067 56.6)
Conversioni di colore
- HEX
- #875f42
- RGB
- rgb(135 95 66)
- HSL
- hsl(25 34% 39%)
- HWB
- hwb(25 26% 47%)
- OKLCH
- oklch(0.521 0.067 56.6)
- OKLab
- oklab(0.521 0.037 0.056)
- CIE Lab
- lab(44.12 14.17 23.37)
- LCH
- lch(44.12 27.33 58.8)
- CMYK
- cmyk(0% 30% 51% 47%)
Tinte · Ombre · Toni
Tinte
- 936E54
- 9F7D66
- AB8D78
- B79C8A
- C3AC9D
- CFBCB0
- DBCDC3
- E7DDD7
- F3EEEB
Ombre
- 755238
- 63442F
- 513825
- 412C1C
- 312014
- 21150B
- 130A05
- 060301
- 010000
Toni
- 876249
- 86664F
- 866955
- 856D5C
- 847062
- 847368
- 83766E
- 827A74
- 817D7A
Armonie di colore
Complementare +180°
- 875F42
Cocoa
- 416F8B
≈ Sojourn Blue
Analogo -30° +30°
- 875F42
Cocoa
- 8C5A54
≈ Red Willow
- 7A673A
≈ Eminent Bronze
Triadico +120° +240°
- 875F42
Cocoa
- 397668
≈ Nominee
- 6D618C
≈ Posy Purple
Complementare divisa +150° +210°
- 875F42
Cocoa
- 33747C
≈ King Tide
- 576890
≈ UCLA Blue
Tetradico +90° +180° +270°
Contrasto e accessibilità
Ag
AASu bianco
WCAG 5.60:1 · APCA Lc 78
Ag
FailSu nero
WCAG 3.74:1 · APCA Lc 24
Miglior colore del testo: #FFFFFF
WCAG 5.60:1 (AA) · APCA Lc 78
Contrast pairs
Frammenti di codice
CSS
:root {
--cocoa: #875f42;
--cocoa-rgb: 135 95 66;
--cocoa-oklch: oklch(0.521 0.067 56.6);
}
.element {
color: var(--cocoa);
background-color: hsl(25 34% 39%);
border-color: oklch(0.521 0.067 56.6);
}Tailwind CSS v4
@theme {
--color-cocoa: #875f42;
--color-cocoa-50: #fff1e3;
--color-cocoa-100: #fae3d2;
--color-cocoa-200: #ebceb8;
--color-cocoa-300: #d2b096;
--color-cocoa-400: #be9578;
--color-cocoa-500: #a97b5a;
--color-cocoa-600: #8f684c;
--color-cocoa-700: #72533d;
--color-cocoa-800: #553c2c;
--color-cocoa-900: #3b291d;
--color-cocoa-950: #25170d;
}SCSS
$cocoa: #875f42;
$cocoa-rgb: 135, 95, 66;
$cocoa-light: mix(#fff, $cocoa, 20%);
$cocoa-dark: mix(#000, $cocoa, 20%);
.element {
color: $cocoa;
box-shadow: 0 0 0 2px rgba($cocoa, 0.35);
}