El naranja oscuro es una versión profunda y rica del naranja. Aunque no es tan brillante como un naranja estándar en la rueda de colores, mantiene su vitalidad inclinándose más hacia el rojo y ocupando el extremo más profundo del espacio de color RGB. Debido a su calidez, el naranja oscuro transmite una sensación de confort y positividad.

El naranja oscuro se define por los siguientes códigos y valores de color para asegurar la consistencia en varias plataformas y dispositivos digitales.
- Código HEX: #C76E00
- Valor RGB: 78% rojo, 43.1% verde y 0% azul
Las consideraciones de accesibilidad juegan un papel crucial en las elecciones de color de diseño UX y UI. Figma ofrece plugins en la Comunidad para asegurarse de que tus diseños cumplan con las Pautas de Accesibilidad de Contenidos Web.
Aquí hay algunas formas de usar el naranja oscuro en tus diseños:
- Crea titulares contrastantes. El texto en naranja oscuro hace que los titulares y títulos resalten sobre fondos blancos, negros o beige. Usa fondos como el azul verdoso, azul o verde oscuro para un efecto aún más audaz.
- Añade energía y calidez. El naranja oscuro evoca sentimientos de energía, entusiasmo y calidez. Es una buena opción para sitios web o aplicaciones que quieren sentirse emocionantes, como aplicaciones de fitness, herramientas creativas o sitios web de eventos.
- Transmite sofisticación y valor. Cuando se combina con colores como crema o marfil, el naranja oscuro añade sofisticación a los diseños. Esto es particularmente útil para marcas de lujo o portafolios de diseño.
Ten en cuenta que el color y su significado pueden cambiar de una cultura a otra, y en cualquier momento. Si estás diseñando para una audiencia global, investiga las consideraciones de color para tus regiones específicas.
Para variaciones dentro del mismo espectro cálido y rico que el naranja oscuro, considera:
- Naranja (#FFA500) es un color vibrante, similar a la cáscara de una mandarina.
- Naranja quemado (#BE5103) se inclina más hacia el rojo y es un poco más brillante.
- Naranja amarillento (#FFB800) es un naranja más alegre con un toque de amarillo.
- Naranja rojizo (#FF4B33) ofrece un rojo vibrante mezclado con naranja.
Debido a sus tonos intensos y cálidos, el naranja oscuro se combina bien con otros colores que realzan esta audacia o crean un contraste llamativo. Para complementar el naranja oscuro, considera combinarlo con:
- Azul marino (#000080) y naranja oscuro son una combinación clásica que exuda elegancia y sofisticación, a menudo utilizada en diseños o entornos de alta gama.
- Dorado (#EFBF04) se combina bien con el naranja oscuro para crear un diseño aún más asertivo y glamuroso.
- Crema (#FDFBD4) es un color suave que equilibra la intensidad del naranja oscuro, creando un espacio cálido y acogedor.
- Verde salvia (#98A869) se combina con el naranja oscuro para evocar una sensación de naturaleza y tranquilidad.
Otros colores complementarios para el naranja oscuro incluyen tonos joya, verdes más terrosos y azul verdoso para mayor vitalidad.
Aunque el naranja oscuro es calmado y cálido, puede chocar con:
- Fucsia (#FE3894) es un color intenso que se ve discordante cuando se combina con el naranja oscuro.
- Rosa (#FF8DA1) es un color más ligero y aireado quepuede chocar con la audacia del naranja oscuro.
- Rosa (#FF1D8D) se inclina hacia lo frío con su fuerte presencia de azul, mientras que el naranja oscuro es un color cálido.
- Verde neón (#2CFF05) es complicado de combinar con el naranja oscuro porque ambos son altamente saturados e intensos.
El naranja oscuro evoca sentimientos de calidez, energía suave y lujo. Se sitúa entre el naranja y el rojo en el espectro de colores, heredando la audacia del rojo y la energía del naranja.
Aunque el naranja oscuro comparte algo de la vitalidad del naranja, se inclina más hacia la pasión y la ambición. Representa entusiasmo, pero también puede inclinarse hacia la negatividad como el egoísmo o la agresión.
Para diseños de UI, el naranja oscuro puede atraer la atención hacia elementos importantes. Su naturaleza audaz acentúa las llamadas a la acción sin abrumar al espectador. Cuando se combina con marrones o beiges, el naranja oscuro también es una excelente opción para evocar una sensación de historia, tradición o naturaleza. Esto es especialmente valioso para marcas que quieren crear una sensación de confort o estabilidad en sus diseños.
En el antiguo Egipto y Roma, minerales como el rejalgar y el oropimente se usaban para pinturas. Estos pigmentos ofrecían una gama de tonos naranjas, algunos inclinándose hacia lo más oscuro. En el siglo XX, un auge de movimientos de diseño abrazó los colores audaces. El Art Deco, por ejemplo, utilizó una gama de naranjas que podría haber contribuido a una creciente apreciación por el color. Hoy en día, el naranja oscuro todavía se usa como un acento en diseños de interiores y UI.
Variantes de color
Sombras
Tintes
Tonos
Tonalidades
Armonías de color
Complementaria
Complementaria dividida
Monocromática
Análoga
Triádica
Square
Paletas personalizadas
Brasa de otoño
Equinoccio
Sidra especiada
Comprobador de contraste
Contraste 3,71
- Texto largo
#C76E00
- Texto normal
Cómo diseñas, alineas, y desarrollas importa. Hazlo con Figma.
| Categoría | ||
|---|---|---|
Desaprobar | Desaprobar | |
Aprobar | Desaprobar | |
Aprobar | Desaprobar |
Contraste 5,66
- Texto largo
#C76E00
- Texto normal
Cómo diseñas, alineas, y desarrollas importa. Hazlo con Figma.
| Categoría | ||
|---|---|---|
Aprobar | Desaprobar | |
Aprobar | Aprobar | |
Aprobar | Aprobar |
Simulaciones de color
Protanopia
Deuteranopia
Tritanopia
Acromatopsia
El color hexadecimal #c76e00, también llamado Naranja oscuro, tiene valores RGB de R:199, G:110, B:0 y valores CMYK de C:0, M:45, Y:100, K:22.
| VALUE | CSS | |
|---|---|---|
| HEX | #c76e00 | #c76e00 |
| RGB DECIMAL | 199, 110, 0 | RGB(199,110,0) |
| RGB PERCENTAGE | 78.0, 43.1, 0.0 | RGB(78.0%,43.1%,0.0%) |
| CMYK | 0, 45, 100, 22 | |
| HSL | HSL(33.2, 100.0%, 39.0%) | HSL(33.2, 100.0%, 39.0%) |
| HSV (OR HSB) | 33.2°, 100.0, 78.0 | |
| WEB SAFE | #2041020 | #2041020 |
| BINARY | 11000111, 01101110, 00000000 | |
| iOS - SwiftUI | Color(red: 0.780, green: 0.431, blue: 0.000) | |
| iOS - UIKit | UIColor(red: 0.780, green: 0.431, blue: 0.000, alpha: 1) | |
| Android - Compose | Color(0xFFC76E00) |


