Benannte Farbe · #772211
Tempered Chocolate
Tempered Chocolate ist #772211: rgb(119 34 17), hsl(10 75% 27%), oklch(0.385 0.122 33.2). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Red mean? → · Tempered Chocolate color name →
#772211
oklch(0.385 0.122 33.2)
Farbumrechnungen
- HEX
- #772211
- RGB
- rgb(119 34 17)
- HSL
- hsl(10 75% 27%)
- HWB
- hwb(10 7% 53%)
- OKLCH
- oklch(0.385 0.122 33.2)
- OKLab
- oklab(0.385 0.102 0.067)
- CIE Lab
- lab(27.53 36.96 32.19)
- LCH
- lch(27.53 49.01 41.1)
- CMYK
- cmyk(0% 71% 86% 53%)
Tints · Shades · Tones
Tints
- 863929
- 954F40
- A36456
- B1796D
- BF8F84
- CCA59C
- D9BBB4
- E6D1CC
- F3E8E5
Shades
- 671C0D
- 571609
- 471106
- 380B04
- 2A0702
- 1C0301
- 100100
- 050000
- 010000
Tones
- 792E1E
- 7B382A
- 7D4235
- 7F4B40
- 80544B
- 815D55
- 816660
- 816F6A
- 817775
Farbharmonien
Komplementär +180°
- 772211
Tempered Chocolate
- 004D59
≈ Watercolour Blue
Analog -30° +30°
- 772211
Tempered Chocolate
- 741E3D
≈ Rocking Chair
- 643700
≈ Brown
Triadisch +120° +240°
- 772211
Tempered Chocolate
- 005229
≈ Lemon Balm Green
- 303B83
≈ Official Violet
Geteilt komplementär +150° +210°
- 772211
Tempered Chocolate
- 004F47
≈ Action Green
- 004871
≈ Broadwater Blue
Tetradisch +90° +180° +270°
- 772211
Tempered Chocolate
- 3A4B00
≈ Godzilla
- 004D59
≈ Watercolour Blue
- 522F78
≈ Regalia
Kontrast & Barrierefreiheit
Ag
AAAAuf Weiß
WCAG 10.38:1 · APCA Lc 93
Ag
FailAuf Schwarz
WCAG 2.02:1 · APCA Lc 9
Beste Textfarbe: #FFFFFF
WCAG 10.38:1 (AAA) · APCA Lc 93
Contrast pairs
Code-Snippets
CSS
:root {
--tempered-chocolate: #772211;
--tempered-chocolate-rgb: 119 34 17;
--tempered-chocolate-oklch: oklch(0.385 0.122 33.2);
}
.element {
color: var(--tempered-chocolate);
background-color: hsl(10 75% 27%);
border-color: oklch(0.385 0.122 33.2);
}Tailwind CSS v4
@theme {
--color-tempered-chocolate: #772211;
--color-tempered-chocolate-50: #ffeade;
--color-tempered-chocolate-100: #ffdacd;
--color-tempered-chocolate-200: #ffc2b1;
--color-tempered-chocolate-300: #eea18d;
--color-tempered-chocolate-400: #dc826f;
--color-tempered-chocolate-500: #ca644f;
--color-tempered-chocolate-600: #aa5543;
--color-tempered-chocolate-700: #894436;
--color-tempered-chocolate-800: #663027;
--color-tempered-chocolate-900: #48211a;
--color-tempered-chocolate-950: #2e100b;
}SCSS
$tempered-chocolate: #772211;
$tempered-chocolate-rgb: 119, 34, 17;
$tempered-chocolate-light: mix(#fff, $tempered-chocolate, 20%);
$tempered-chocolate-dark: mix(#000, $tempered-chocolate, 20%);
.element {
color: $tempered-chocolate;
box-shadow: 0 0 0 2px rgba($tempered-chocolate, 0.35);
}