Color con nombre · #5F1933
Brown Chocolate
Brown Chocolate es #5F1933: rgb(95 25 51), hsl(338 58% 24%), oklch(0.336 0.104 1.8). Mira tintes, sombras, armonías, contraste WCAG y APCA, y código CSS, Tailwind v4 y SCSS.
What does Red mean? → · Brown Chocolate color name →
#5F1933
oklch(0.336 0.104 1.8)
Conversiones de color
- HEX
- #5f1933
- RGB
- rgb(95 25 51)
- HSL
- hsl(338 58% 24%)
- HWB
- hwb(338 10% 63%)
- OKLCH
- oklch(0.336 0.104 1.8)
- OKLab
- oklab(0.336 0.104 0.003)
- CIE Lab
- lab(21.74 33.66 1.75)
- LCH
- lch(21.74 33.71 3)
- CMYK
- cmyk(0% 74% 46% 63%)
Tintes · Sombras · Tonos
Tintes
- 703045
- 804657
- 915B6A
- A1717E
- B18892
- C19FA7
- D0B6BC
- E0CED2
- F0E6E8
Sombras
- 52142B
- 441023
- 380B1C
- 2C0714
- 20040D
- 150207
- 0A0103
- 030001
- 000000
Tonos
- 64253A
- 683041
- 6C3A49
- 704450
- 734E58
- 765860
- 796268
- 7C6C70
- 7E7678
Armonías de color
Complementario +180°
- 5F1933
Brown Chocolate
- 004139
≈ Botanical Night
Análogo -30° +30°
- 5F1933
Brown Chocolate
- 541E4E
≈ Violet Carmine
- 621B10
≈ Altar Wine
Triádico +120° +240°
- 5F1933
Brown Chocolate
- 303D00
≈ Dark Olive
- 003B5C
≈ Poseidon
Complementario dividido +150° +210°
- 5F1933
Brown Chocolate
- 00431E
≈ Deep Pond
- 003F48
≈ Ghostlands Coal
Tetrádico +90° +180° +270°
- 5F1933
Brown Chocolate
- 443500
≈ Night in the Woods
- 004139
≈ Botanical Night
- 25306C
≈ Blue Rose
Contraste y accesibilidad
Ag
AAASobre blanco
WCAG 12.54:1 · APCA Lc 98
Ag
FailSobre negro
WCAG 1.67:1 · APCA Lc 0
Mejor color de texto: #FFFFFF
WCAG 12.54:1 (AAA) · APCA Lc 98
Contrast pairs
Fragmentos de código
CSS
:root {
--brown-chocolate: #5f1933;
--brown-chocolate-rgb: 95 25 51;
--brown-chocolate-oklch: oklch(0.336 0.104 1.8);
}
.element {
color: var(--brown-chocolate);
background-color: hsl(338 58% 24%);
border-color: oklch(0.336 0.104 1.8);
}Tailwind CSS v4
@theme {
--color-brown-chocolate: #5f1933;
--color-brown-chocolate-50: #ffeaf2;
--color-brown-chocolate-100: #ffdae4;
--color-brown-chocolate-200: #fcc2cf;
--color-brown-chocolate-300: #e5a1b1;
--color-brown-chocolate-400: #d1849a;
--color-brown-chocolate-500: #be6781;
--color-brown-chocolate-600: #a0586d;
--color-brown-chocolate-700: #814657;
--color-brown-chocolate-800: #5f3241;
--color-brown-chocolate-900: #43222d;
--color-brown-chocolate-950: #2b111a;
}SCSS
$brown-chocolate: #5f1933;
$brown-chocolate-rgb: 95, 25, 51;
$brown-chocolate-light: mix(#fff, $brown-chocolate, 20%);
$brown-chocolate-dark: mix(#000, $brown-chocolate, 20%);
.element {
color: $brown-chocolate;
box-shadow: 0 0 0 2px rgba($brown-chocolate, 0.35);
}