Couleur nommée la plus proche · #663634
#663634
Couleur nommée la plus proche: Hot Chocolate
#663634 (rgb(102 54 52), hsl(2 32% 30%), oklch(0.393 0.069 23.2)) est la plus proche de la couleur nommée Hot Chocolate. Teintes, ombres, harmonies, contraste WCAG et APCA, et code CSS, Tailwind v4 et SCSS.
#663634
oklch(0.393 0.069 23.2)
Conversions de couleur
- HEX
- #663634
- RGB
- rgb(102 54 52)
- HSL
- hsl(2 32% 30%)
- HWB
- hwb(2 20% 60%)
- OKLCH
- oklch(0.393 0.069 23.2)
- OKLab
- oklab(0.393 0.063 0.027)
- CIE Lab
- lab(28.93 21.72 11.23)
- LCH
- lch(28.93 24.46 27.3)
- CMYK
- cmyk(0% 47% 49% 60%)
Teintes · Ombres · Tons
Teintes
- 754846
- 845B58
- 946E6B
- A3827F
- B29593
- C1AAA8
- D1BFBD
- E0D4D3
- EFE9E9
Ombres
- 582E2C
- 4A2524
- 3C1E1C
- 2F1615
- 230F0E
- 170807
- 0C0303
- 040101
- 000000
Tons
- 693D3B
- 6C4543
- 6F4C4A
- 725451
- 755B59
- 776261
- 7A6A68
- 7C7170
- 7E7978
Harmonies de couleurs
Complémentaire +180°
- 663634
Hot Chocolate
- 005056
≈ Transporter Green
Analogue -30° +30°
- 663634
Hot Chocolate
- 623549
≈ Grape Wine
- 633B20
≈ Cassiterite Brown
Triadique +120° +240°
- 663634
Hot Chocolate
- 2E4F2D
≈ Nettle Green
- 32456B
≈ Forlorn Cruise
Complémentaire divisée +150° +210°
- 663634
Hot Chocolate
- 0F5242
≈ Tetsu Green
- 174C65
≈ Victorian Peacock
Tétradique +90° +180° +270°
- 663634
Hot Chocolate
- 464A1A
≈ Bronze Tone
- 005056
≈ Transporter Green
- 473E67
≈ Evening Mauve
Contraste et accessibilité
Ag
AAASur blanc
WCAG 9.80:1 · APCA Lc 92
Ag
FailSur noir
WCAG 2.14:1 · APCA Lc 10
Meilleure couleur de texte: #FFFFFF
WCAG 9.80:1 (AAA) · APCA Lc 92
Contrast pairs
Extraits de code
CSS
:root {
--hot-chocolate: #663634;
--hot-chocolate-rgb: 102 54 52;
--hot-chocolate-oklch: oklch(0.393 0.069 23.2);
}
.element {
color: var(--hot-chocolate);
background-color: hsl(2 32% 30%);
border-color: oklch(0.393 0.069 23.2);
}Tailwind CSS v4
@theme {
--color-hot-chocolate: #663634;
--color-hot-chocolate-50: #ffeeeb;
--color-hot-chocolate-100: #fee0dc;
--color-hot-chocolate-200: #f1cac5;
--color-hot-chocolate-300: #d9aaa6;
--color-hot-chocolate-400: #c48f8b;
--color-hot-chocolate-500: #af7470;
--color-hot-chocolate-600: #94625f;
--color-hot-chocolate-700: #774f4c;
--color-hot-chocolate-800: #583938;
--color-hot-chocolate-900: #3e2726;
--color-hot-chocolate-950: #271515;
}SCSS
$hot-chocolate: #663634;
$hot-chocolate-rgb: 102, 54, 52;
$hot-chocolate-light: mix(#fff, $hot-chocolate, 20%);
$hot-chocolate-dark: mix(#000, $hot-chocolate, 20%);
.element {
color: $hot-chocolate;
box-shadow: 0 0 0 2px rgba($hot-chocolate, 0.35);
}