El chocolate es un tono cálido de marrón ubicado entre el rojo y el amarillo en la rueda de colores. Su tono rico, que se asemeja al chocolate con leche, emana comodidad y estabilidad.

El chocolate se define por los siguientes códigos y valores de color para asegurar la consistencia en diversas plataformas y dispositivos digitales.
- Código HEX: #713600
- Valor RGB: 44.3% rojo, 21.2% verde, y 0% azul
Aquí hay algunas formas de usar el chocolate en tus diseños:
- Añade profundidad. La riqueza del marrón chocolate es ideal para crear sombras y realces en elementos de UI, generando una sensación de dimensión y separación del fondo.
- Infunde calidez. Las cualidades reconfortantes del chocolate crean una atmósfera acogedora e invitante, perfecta para cafeterías o panaderías. Úsalo como color de acento en botones, texto o íconos, combinado con colores claros y aireados como crema o beige para un aspecto equilibrado.
- Crea una interfaz inspirada en la naturaleza. Para marcas al aire libre que promueven actividades como acampar, hacer senderismo o jardinería, el marrón chocolate crea una conexión con la tierra. Es excelente como color primario o secundario combinado con otros tonos verdes y neutros para complementar la estética natural.
Ten en cuenta que el color y su significado pueden variar según la cultura y el contexto. Si diseñas para una audiencia internacional, investiga cómo se perciben los colores en cada país.
Para variaciones dentro del mismo espectro rico que el chocolate, considera:
- Moca (#6D3B07) es un poco más oscuro, asemejándose a la infusión de café y chocolate.
- Marrón (#895129) ofrece un toque ligeramente más claro con la misma calidez.
- Topo (#54463A) aparece más frío debido a sus matices grises.
- Granate (#550000) comparte una riqueza similar, inclinándose más hacia el rojo con sutiles toques de marrón.
Para complementar el chocolate, considera combinarlo con:
- Azul marino (#000080) proporciona una combinación de colores atemporal y sofisticada.
- Crema (#FDFBD4) ofrece un fondo neutral y calmante que permite que el chocolate resalte.
- Verde bosque (#2E6F40) crea una paleta armoniosa con un toque natural.
- Naranja quemado (#BE5103) añade calidez al chocolate para crear una paleta de colores inspirada en el otoño.
- Durazno (#FFD3AC) ofrece un contraste suave y delicado junto al marrón chocolate.
Otros colores que vale la pena considerar incluyen azul claro para una sensación relajada, mandarina para un toque de vitalidad, y salvia para una paleta de colores terrosos.
Aunque el chocolate es cálido, puede chocar con:
- Azul real (#305CDE) tiene una vibración que puede crear un contraste fuerte junto al chocolate.
- Gris plomo (#353E43) puede parecer turbio, interrumpiendo la vibra cálida e invitante del chocolate.
- Amarillo verdoso (#CCFF00) carece de armonía con el chocolate debido a su atractivo vibrante.
- Violeta (#7F00FF) es frío y puede crear una combinación de colores desequilibrada.
El chocolate simboliza estabilidad, fuerza y resiliencia. También lleva connotaciones de lujo e indulgencia.
En la psicología del color, el chocolate promueve calidez y comodidad. Similar a un trozo de chocolate decadente o una taza de cacao caliente, también evoca sentimientos de placer. Debido a su conexión con tonos naturales, el chocolate también genera sensaciones de paz y tranquilidad.
En el diseño de interfaces, el chocolate crea una atmósfera cálida e invitante, ideal para aplicaciones de cafeterías o panaderías. Su riqueza también es útil para añadir profundidad y textura a los elementos, lo que ayuda a añadir interés visual a cualquier interfaz.
El nombre del color “Chocolate” se registró en 1734, inspirado en el tono de su homónimo. Sin embargo, la palabra “chocolate” entró en el idioma inglés alrededor de 1600 después de que los españoles introdujeran el chocolate al resto de Europa.
En la antigua Roma, los tonos de marrón se asociaban con la clase baja. Esta conexión cambió cuando el chocolate se convirtió en un bien de lujo en Europa, conectando el color con la exclusividad. Esto probablemente contribuye a la percepción actual del marrón chocolate como un color que simboliza indulgencia y sofisticación.
Aparte de su conexión con el dulce, los tonos marrones terrosos del chocolate se encuentran en toda la naturaleza. Por ejemplo, las Montañas de Chocolate en el sur de California fueron nombradas por el color, ya que parecían montículos de chocolate durante las estaciones secas. Hoy en día, la versatilidad del chocolate se extiende más allá de su conexión natural y se utiliza en moda, diseño, cosméticos y arte.
Variantes de color
Sombras
Tintes
Tonos
Matices
Armonías de color
Complementario
Dividido
Monocromático
Análogo
Triádico
Cuadrado
Paletas personalizadas
Pastel de Chocolate
Piedra Marrón
Encanto Rústico
Verificador de contraste
Contraste 9,42
- Texto grande
#713600
- Texto normal
Tu forma de diseñar, alinear y crear importa. Hazlo todo con Figma.
| Categoría | ||
|---|---|---|
Aprobado | Aprobado | |
Aprobado | Aprobado | |
Aprobado | Aprobado |
Contraste 2,23
- Texto grande
#713600
- Texto normal
Tu forma de diseñar, alinear y crear importa. Hazlo todo con Figma.
| Categoría | ||
|---|---|---|
Desaprobado | Desaprobado | |
Desaprobado | Desaprobado | |
Desaprobado | Desaprobado |
Simulaciones de color
Protanopia
Deuteranopia
Tritanopia
Acromatopsia
El color hexadecimal #713600, también conocido como Chocolate, tiene valores RGB de R:113, G:54, B:0 y valores CMYK de C:0, M:52, Y:100, K:56.
| VALUE | CSS | |
|---|---|---|
| HEX | #713600 | #713600 |
| RGB DECIMAL | 113, 54, 0 | RGB(113,54,0) |
| RGB PERCENTAGE | 44.3, 21.2, 0.0 | RGB(44.3%,21.2%,0.0%) |
| CMYK | 0, 52, 100, 56 | |
| HSL | HSL(28.7, 100.0%, 22.2%) | HSL(28.7, 100.0%, 22.2%) |
| HSV (OR HSB) | 28.7°, 100.0, 44.3 | |
| WEB SAFE | #102510 | #102510 |
| BINARY | 01110001, 00110110, 00000000 | |
| iOS - SwiftUI | Color(red: 0.443, green: 0.212, blue: 0.000) | |
| iOS - UIKit | UIColor(red: 0.443, green: 0.212, blue: 0.000, alpha: 1) | |
| Android - Compose | Color(0xFF713600) |


