Dusty Orange #F0833A
Dusty Orange es un naranja medio-claro y vívido, con código hex #F0833A y RGB rgb(240, 131, 58).
Aa
El texto negro es el que mejor se lee sobre este color (8.01:1).
Sobre este color
#F0833A es un naranja medio-claro y vívido. En OKLCH, su luminosidad es 72%, su croma 0.158 y su matiz 51°. Su matiz está del lado cálido de la rueda cromática. Es el color con nombre Dusty Orange. El texto negro es el que mejor se lee sobre este color, con 8.01:1.
| Familia de matiz | Naranjas |
| Luminosidad | medio-claro (72%) |
| Croma | vívido (0.158) |
| Temperatura | cálido |
| Nombre más cercano | Dusty Orange |
| Texto negro | 8.01:1 |
| Texto blanco | 2.62:1 |
Colores que combinan con Dusty Orange
Combinaciones obtenidas al rotar Dusty Orange por la rueda de matiz de OKLCH, cada una con el nombre más cercano de nuestra lista.
Complementario
El matiz opuesto (180°).
Análogo
Matices vecinos, 30° a cada lado.
Triádico
Tres matices separados por 120°.
Paletas de colores con Dusty Orange
Paletas seleccionadas que contienen un color a menos de ΔE 0.06 (OKLab) de Dusty Orange, de la más cercana a la más lejana.
Colores con nombre similares
Los ocho colores con nombre más cercanos a Dusty Orange, con su distancia ΔE.
- Orange Wheel #F77F00 ΔE 0.024
- Pumpkin Orange #FB7D07 ΔE 0.026
- Coral #FF7F50 ΔE 0.036
- Faded Orange #F0944D ΔE 0.037
- Dull Orange #D8863B ΔE 0.042
- Dark Orange #FF8C00 ΔE 0.044
- Pumpkin #E17701 ΔE 0.045
- Melon #FF7855 ΔE 0.047
Más sobre Dusty Orange
Cómo hacer Dusty Orange
Una receta inicial con colores de pintura comunes, calculada con un modelo espectral de pintura (el modo pintura del mezclador). Los pigmentos reales varían: mezcla primero una pequeña prueba y ajusta.
- 2 partes de naranja
- 1 parte de rosa
Resultado de la receta: #F1832A, una diferencia de ΔE 0.010 respecto a Dusty Orange. Es muy parecido: la mayoría de la gente no notará la diferencia.
¿Qué colores forman el naranja? | Tabla de mezcla de colores
Códigos de Dusty Orange en todos los formatos
| HEX | #F0833A |
| RGB | rgb(240, 131, 58) |
| HSL | hsl(24, 86%, 58%) |
| OKLCH | oklch(71.9% 0.158 51) |
Contraste
Las relaciones de contraste de WCAG 2 son el objetivo de conformidad: AA exige 4.5:1 para texto de cuerpo y 3:1 para texto grande; AAA exige 7:1. Los valores Lc de APCA son una guía complementaria de los borradores de WCAG 3.
| Combinación | WCAG 2 | Resultado | APCA | Guía APCA |
|---|---|---|---|---|
| Texto blanco sobre #F0833A | 2.62:1 | No cumple | Lc -55.8 | Texto grande o en negrita, títulos |
| Texto negro sobre #F0833A | 8.01:1 | AAA | Lc 53.4 | Texto grande o en negrita, títulos |
| Texto #F0833A sobre blanco | 2.62:1 | No cumple | Lc 50.6 | Texto grande o en negrita, títulos |
| Texto #F0833A sobre negro | 8.01:1 | AAA | Lc -51.3 | Texto grande o en negrita, títulos |
Tonos y tintes de Dusty Orange
Una escala de 50 a 950 creada en OKLCH: el matiz se mantiene, la luminosidad sigue una curva parecida a la de Tailwind v4 y cada paso permanece dentro de la gama sRGB. Este color está en el paso 400.
-
Paso 50
50
#FDF3EE
oklch(97.1% 0.013 48.6)
-
Paso 100
100
#FAE5D9
oklch(93.6% 0.028 51.8)
-
Paso 200
200
#F8D0B9
oklch(88.6% 0.055 51.6)
-
Paso 300
300
#F4AE86
oklch(80.8% 0.098 50.6)
-
Paso 400
400 (este color)
#F0833A
oklch(71.9% 0.158 51)
-
Paso 500
500
#D46500
oklch(63% 0.164 50.9)
-
Paso 600
600
#B35500
oklch(55.7% 0.144 51.3)
-
Paso 700
700
#974600
oklch(49% 0.128 50.9)
-
Paso 800
800
#7D3900
oklch(42.8% 0.111 51.1)
-
Paso 900
900
#692F00
oklch(37.8% 0.098 51.3)
-
Paso 950
950
#401A00
oklch(27% 0.07 51.3)
Exporta esta escala para Tailwind con la herramienta de colores de Tailwind
Dusty Orange con daltonismo
Simulado con el modelo de Machado et al. (2009). ΔE es cuánto se desplaza el color: por debajo de 0.02 aproximadamente no notarías el cambio.
| Visión | Se ve como | Cambio (ΔE) |
|---|---|---|
| Protanopía (sin conos rojos) | #A29131 | 0.135 |
| Deuteranopía (sin conos verdes) | #BCA939 | 0.121 |
| Tritanopía (sin conos azules) | #FF6C74 | 0.094 |
| Acromatopsia (sin color) | #A0A0A0 | 0.158 |
Usa Dusty Orange en tu producto
Conviértelo en roles de interfaz claros y oscuros con el contraste verificado y expórtalos a Tailwind v4, shadcn/ui, CSS o design tokens.