Color Mostaza: código #FFDB58

Mostaza

#FFDB58

Códigos del color

  • HEX#FFDB58
  • RGBrgb(255, 219, 88)
  • HSLhsl(47, 100%, 67%)
  • HSVhsv(47, 65%, 100%)
  • CMYKcmyk(0%, 14%, 65%, 0%)
  • LABlab(88.3% -1.5 66.8)
  • OKLCHoklch(89.9% 0.151 93.7)

Sobre el color Mostaza

Mostaza tiene el código HEX #FFDB58, que corresponde a rgb(255, 219, 88) en el modelo RGB. En el círculo cromático, su tono está en 47°, con 100% de saturación y 67% de luminosidad (hsl(47, 100%, 67%)).

Por su tono se percibe como un color cálido: suele transmitir energía y cercanía y «avanza» visualmente en la composición.

Como fondo pide texto oscuro: el negro alcanza un contraste de 15,52:1 sobre él, frente a 1,35:1 del blanco.

Para impresión, la conversión aproximada es cmyk(0%, 14%, 65%, 0%). Confírmala siempre con el perfil de color de la imprenta, porque el resultado depende del papel y la tinta.

Tonos más claros

Tonos más oscuros

Combinaciones con Mostaza

Complementaria

#FFDB58 · #577BFF

Análoga

#FF8657 · #FFDB58 · #CFFF57

Tríada

#FFDB58 · #57FFDB · #DB57FF

Tetrádica

#FFDB58 · #57FF86 · #577BFF · #FF57CF

Complementaria dividida

#FFDB58 · #57CFFF · #8657FF

Monocromática

#D6A800 · #FFCF24 · #FFDB58 · #FFEBA3 · #FFFCF0

Mostaza con texto blanco y negro

Texto blanco Aa Bb Cc 123
1,35:1 · no cumple WCAG
Texto negro Aa Bb Cc 123
15,52:1 · AAA

Prueba otras combinaciones en el verificador de contraste

¿Qué mostaza?

El HEX más difundido para “mostaza” en la web es #FFDB58 (rgb(255, 219, 88)), un amarillo cálido y cremoso con una ligera inclinación al naranja. No es un color con nombre de CSS: procede de listas populares de nombres de colores. Sin embargo, en moda y decoración, “mostaza” suele designar un tono bastante más cerrado, entre el amarillo y el ocre, más parecido al condimento en el frasco. Si quieres que tu sitio combine con un suéter o un sofá mostaza, probablemente tendrás que oscurecerlo. Fotografía la pieza con luz natural y usa el cuentagotas en imagen para obtener el HEX real.

Un amarillo con aire retro

Mientras el amarillo puro suena alegre y urgente, la mostaza se percibe como más madura, acogedora y otoñal. Se asocia mucho con el diseño de los años sesenta y setenta, los muebles de madera y los estampados geométricos, y vuelve cíclicamente a las colecciones de moda. Estas asociaciones son occidentales y generacionales: para quien no creció con esa estética, la mostaza puede parecer simplemente “un amarillo sobrio”.

Aplicaciones y combinaciones

En decoración funciona en butacas, cojines y cortinas, sobre todo junto a madera oscura y gris. En moda, los suéteres, abrigos y pañuelos mostaza favorecen a las pieles de subtono cálido y combinan con mezclilla, marrón y verde. En branding ayuda a cafeterías, panaderías, librerías y estudios de diseño vintage a transmitir calidez sin el aire infantil del amarillo puro. Combinaciones que funcionan:

Mostaza en pantalla: precauciones

#FFDB58 tiene un contraste de apenas 1,35:1 con el blanco, así que nunca pongas texto mostaza sobre blanco ni texto blanco sobre mostaza. Encima de él, usa negro o gris marengo (más de 15:1 con negro). Si necesitas una “mostaza” legible como color de texto sobre fondo claro, oscurécela hasta algo como #8A6D00, que ronda 5:1. En modo oscuro, el tono original funciona bien como acento. Pruébalo en el verificador de contraste.

Cómo usarlo en CSS

:root {
  --color-mustard: #FFDB58;
  --color-mustard-rgb: 255, 219, 88;
}

.elemento {
  background-color: var(--color-mustard);
  color: #000000;
}

Colores parecidos

Usa Mostaza en nuestras herramientas