Colore con nome · #772211
Tempered Chocolate
Tempered Chocolate è #772211: rgb(119 34 17), hsl(10 75% 27%), oklch(0.385 0.122 33.2). Scopri tinte, ombre, armonie, contrasto WCAG e APCA e codice CSS, Tailwind v4 e SCSS.
What does Red mean? → · Tempered Chocolate color name →
#772211
oklch(0.385 0.122 33.2)
Conversioni di colore
- 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%)
Tinte · Ombre · Toni
Tinte
- 863929
- 954F40
- A36456
- B1796D
- BF8F84
- CCA59C
- D9BBB4
- E6D1CC
- F3E8E5
Ombre
- 671C0D
- 571609
- 471106
- 380B04
- 2A0702
- 1C0301
- 100100
- 050000
- 010000
Toni
- 792E1E
- 7B382A
- 7D4235
- 7F4B40
- 80544B
- 815D55
- 816660
- 816F6A
- 817775
Armonie di colore
Complementare +180°
- 772211
Tempered Chocolate
- 004D59
≈ Watercolour Blue
Analogo -30° +30°
- 772211
Tempered Chocolate
- 741E3D
≈ Rocking Chair
- 643700
≈ Brown
Triadico +120° +240°
- 772211
Tempered Chocolate
- 005229
≈ Lemon Balm Green
- 303B83
≈ Official Violet
Complementare divisa +150° +210°
- 772211
Tempered Chocolate
- 004F47
≈ Action Green
- 004871
≈ Broadwater Blue
Tetradico +90° +180° +270°
- 772211
Tempered Chocolate
- 3A4B00
≈ Godzilla
- 004D59
≈ Watercolour Blue
- 522F78
≈ Regalia
Contrasto e accessibilità
Ag
AAASu bianco
WCAG 10.38:1 · APCA Lc 93
Ag
FailSu nero
WCAG 2.02:1 · APCA Lc 9
Miglior colore del testo: #FFFFFF
WCAG 10.38:1 (AAA) · APCA Lc 93
Contrast pairs
Frammenti di codice
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);
}