Colore con nome · #553B3D
Charred Chocolate
Charred Chocolate è #553B3D: rgb(85 59 61), hsl(355 18% 28%), oklch(0.382 0.037 13.8). Scopri tinte, ombre, armonie, contrasto WCAG e APCA e codice CSS, Tailwind v4 e SCSS.
What does Red mean? → · Charred Chocolate color name →
#553B3D
oklch(0.382 0.037 13.8)
Conversioni di colore
- HEX
- #553b3d
- RGB
- rgb(85 59 61)
- HSL
- hsl(355 18% 28%)
- HWB
- hwb(355 23% 67%)
- OKLCH
- oklch(0.382 0.037 13.8)
- OKLab
- oklab(0.382 0.036 0.009)
- CIE Lab
- lab(27.95 12.08 3.57)
- LCH
- lch(27.95 12.59 16.5)
- CMYK
- cmyk(0% 31% 28% 67%)
Tinte · Ombre · Toni
Tinte
- 654C4E
- 755E60
- 857172
- 968485
- A79798
- B8ABAC
- C9C0C0
- DBD4D5
- EDEAEA
Ombre
- 493234
- 3D292B
- 312122
- 26191A
- 1C1112
- 11090A
- 080404
- 020101
- 000000
Toni
- 594243
- 5E484A
- 624F50
- 675657
- 6B5D5D
- 6F6464
- 736B6B
- 787272
- 7C7979
Armonie di colore
Complementare +180°
- 553B3D
Charred Chocolate
- 2A4949
≈ June Bug
Analogo -30° +30°
- 553B3D
Charred Chocolate
- 513B48
≈ Indulgence
- 543D33
≈ Obsidian Brown
Triadico +120° +240°
- 553B3D
Charred Chocolate
- 3B4833
≈ Rifle Green
- 354457
≈ Soulful
Complementare divisa +150° +210°
- 553B3D
Charred Chocolate
- 30493E
≈ Government Green
- 2D4752
≈ Dad’s Coupe
Tetradico +90° +180° +270°
- 553B3D
Charred Chocolate
- 46442D
≈ Tin Bitz
- 2A4949
≈ June Bug
- 404156
≈ Attorney
Contrasto e accessibilità
Ag
AAASu bianco
WCAG 10.09:1 · APCA Lc 93
Ag
FailSu nero
WCAG 2.07:1 · APCA Lc 9
Miglior colore del testo: #FFFFFF
WCAG 10.09:1 (AAA) · APCA Lc 93
Contrast pairs
Frammenti di codice
CSS
:root {
--charred-chocolate: #553b3d;
--charred-chocolate-rgb: 85 59 61;
--charred-chocolate-oklch: oklch(0.382 0.037 13.8);
}
.element {
color: var(--charred-chocolate);
background-color: hsl(355 18% 28%);
border-color: oklch(0.382 0.037 13.8);
}Tailwind CSS v4
@theme {
--color-charred-chocolate: #553b3d;
--color-charred-chocolate-50: #fff1f1;
--color-charred-chocolate-100: #f4e3e4;
--color-charred-chocolate-200: #e4cecf;
--color-charred-chocolate-300: #cab0b1;
--color-charred-chocolate-400: #b39698;
--color-charred-chocolate-500: #9d7d7f;
--color-charred-chocolate-600: #856a6b;
--color-charred-chocolate-700: #6a5456;
--color-charred-chocolate-800: #4e3d3f;
--color-charred-chocolate-900: #362a2b;
--color-charred-chocolate-950: #211819;
}SCSS
$charred-chocolate: #553b3d;
$charred-chocolate-rgb: 85, 59, 61;
$charred-chocolate-light: mix(#fff, $charred-chocolate, 20%);
$charred-chocolate-dark: mix(#000, $charred-chocolate, 20%);
.element {
color: $charred-chocolate;
box-shadow: 0 0 0 2px rgba($charred-chocolate, 0.35);
}