Benannte Farbe · #987B71
Soft Cocoa
Soft Cocoa ist #987B71: rgb(152 123 113), hsl(15 16% 52%), oklch(0.608 0.039 39.9). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Red mean? → · Soft Cocoa color name →
#987B71
oklch(0.608 0.039 39.9)
Farbumrechnungen
- HEX
- #987b71
- RGB
- rgb(152 123 113)
- HSL
- hsl(15 16% 52%)
- HWB
- hwb(15 44% 40%)
- OKLCH
- oklch(0.608 0.039 39.9)
- OKLab
- oklab(0.608 0.03 0.025)
- CIE Lab
- lab(54.22 10.43 9.95)
- LCH
- lch(54.22 14.42 43.7)
- CMYK
- cmyk(0% 19% 26% 40%)
Tints · Shades · Tones
Tints
- A2877E
- AC948C
- B6A19A
- C1AEA7
- CBBBB6
- D5C8C4
- E0D6D2
- EAE3E1
- F4F1F0
Shades
- 846A61
- 705A52
- 5C4A43
- 4A3A35
- 382C27
- 271E1A
- 17100E
- 080504
- 010101
Tones
- 967C73
- 937C74
- 917D76
- 8F7D77
- 8C7E79
- 8A7E7A
- 887F7C
- 857F7D
- 83807F
Farbharmonien
Komplementär +180°
- 987B71
Soft Cocoa
- 698893
≈ Shoreline
Analog -30° +30°
- 987B71
Soft Cocoa
- 98797D
≈ Bohemian Jazz
- 927F69
≈ Weathered Shingle
Triadisch +120° +240°
- 987B71
Soft Cocoa
- 6F8A7A
≈ Hanging Vine
- 7D809A
≈ Blue Intrigue
Geteilt komplementär +150° +210°
- 987B71
Soft Cocoa
- 688A88
≈ Overgrown Trellis
- 71859A
≈ Merman
Tetradisch +90° +180° +270°
- 987B71
Soft Cocoa
- 7B886F
≈ Winter Hedge
- 698893
≈ Shoreline
- 8A7C95
≈ Grey Dusk
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 3.88:1 · APCA Lc 66
Ag
AAAuf Schwarz
WCAG 5.40:1 · APCA Lc 35
Beste Textfarbe: #000000
WCAG 5.40:1 (AA) · APCA Lc 35
Contrast pairs
Code-Snippets
CSS
:root {
--soft-cocoa: #987b71;
--soft-cocoa-rgb: 152 123 113;
--soft-cocoa-oklch: oklch(0.608 0.039 39.9);
}
.element {
color: var(--soft-cocoa);
background-color: hsl(15 16% 52%);
border-color: oklch(0.608 0.039 39.9);
}Tailwind CSS v4
@theme {
--color-soft-cocoa: #987b71;
--color-soft-cocoa-50: #fff2ed;
--color-soft-cocoa-100: #f4e4de;
--color-soft-cocoa-200: #e4cfc7;
--color-soft-cocoa-300: #cab1a8;
--color-soft-cocoa-400: #b4978d;
--color-soft-cocoa-500: #9e7e73;
--color-soft-cocoa-600: #856b61;
--color-soft-cocoa-700: #6b554e;
--color-soft-cocoa-800: #4f3e39;
--color-soft-cocoa-900: #372b27;
--color-soft-cocoa-950: #221815;
}SCSS
$soft-cocoa: #987b71;
$soft-cocoa-rgb: 152, 123, 113;
$soft-cocoa-light: mix(#fff, $soft-cocoa, 20%);
$soft-cocoa-dark: mix(#000, $soft-cocoa, 20%);
.element {
color: $soft-cocoa;
box-shadow: 0 0 0 2px rgba($soft-cocoa, 0.35);
}