≡En resumen
- Yellow significa amarillo y en marketing se asocia sobre todo a optimismo, energía, cercanía y llamada de atención.
- Las asociaciones del color dependen de la cultura y del contexto; no hay un efecto psicológico universal garantizado.
- Marcas como McDonald's, IKEA, DHL, Snapchat o Correos usan el amarillo como fondo o como color de reconocimiento.
- El texto amarillo sobre blanco suspende el contraste WCAG: úsalo como fondo con texto oscuro o en tonos mostaza oscuros.
- Un buen sistema de color define qué combinaciones de amarillo se pueden usar para texto, botones e iconos.
01 ¿Qué significa yellow?
En el modelo de luz de las pantallas (RGB), el amarillo se obtiene sumando rojo y verde al máximo: #FFFF00. En impresión (CMYK) es uno de los tres colores primarios sustractivos, junto al cian y al magenta. Por eso un mismo amarillo de marca necesita al menos dos definiciones: una para pantalla y otra para imprenta, además de su referencia en guías de color como Pantone.
«Yellow» también da nombre a obras conocidas, como el sencillo de Coldplay publicado en 2000 dentro del álbum Parachutes, pero en marketing y diseño la palabra se refiere siempre al color.
02 Qué transmite el amarillo: psicología del color
Las encuestas de la socióloga Eva Heller, autora de Psicología del color, situaron el amarillo como el color que más se asocia en Occidente a la diversión, la amabilidad, el humor, la alegría y la espontaneidad, pero también a la envidia, los celos o la traición. Es un buen ejemplo de que un color no tiene un único significado: depende de la cultura, del tono exacto y de con qué se combine. En la China imperial, el amarillo intenso estaba reservado al emperador y su familia; en la señalización vial, en cambio, significa precaución.
Optimismo y energía
Tonos limpios y luminosos. Frecuentes en marcas de consumo, alimentación, ocio y servicios cercanos.
Atención y alerta
Es muy visible, por eso se usa en señales de peligro, chalecos y vehículos de emergencia.
Asequibilidad
Combinado con rojo o negro, se asocia a ofertas, rapidez y precios bajos.
Lujo cálido
Los amarillos dorados y ocres se acercan al oro y transmiten tradición o calidad.
03 Marcas que usan el amarillo (y cómo lo hacen)
| Marca | Cómo usa el amarillo | Qué combina |
|---|---|---|
| McDonald's | Los arcos amarillos del logotipo | Rojo como color de fondo en muchas piezas |
| IKEA | Rectángulo del logotipo y bolsas | Azul, los colores de la bandera sueca |
| DHL | Fondo de furgonetas, uniformes y web | Texto y logotipo en rojo |
| Snapchat | Fondo del icono de la app | Fantasma blanco con contorno negro |
| National Geographic | Marco rectangular del logotipo | Fondo blanco o negro según la pieza |
| Correos | Buzones, vehículos y logotipo | Azul para el texto y el símbolo |
Fíjate en el patrón: casi ninguna marca escribe textos en amarillo sobre blanco. Lo usan como superficie (fondo, buzón, furgoneta) y ponen encima texto oscuro, rojo o azul. Así ganan reconocimiento sin perder legibilidad. Es una decisión de identidad visual que conviene tomar desde el principio, cuando se diseña el logotipo y la paleta.
04 El problema del amarillo en web: contraste y WCAG
Las pautas WCAG del W3C piden un contraste mínimo de 4,5:1 para texto normal y de 3:1 para texto grande (18 puntos o 14 puntos en negrita) en el nivel AA, y también 3:1 para iconos, bordes de campos y otros elementos gráficos necesarios. El amarillo es muy luminoso, casi tanto como el blanco, así que sobre fondo blanco se queda muy lejos de esos mínimos.
| Color | Sobre blanco | Sobre negro | Uso recomendado |
|---|---|---|---|
| #FFFF00 amarillo puro | 1,07:1 | 19,56:1 | Solo como fondo, con texto negro |
| #FFCC00 amarillo de marca típico | 1,51:1 | 13,89:1 | Fondos y botones con texto oscuro |
| #E0A800 amarillo oscuro | 2,15:1 | 9,77:1 | Fondos; nunca texto sobre blanco |
| #B38600 mostaza | 3,32:1 | 6,33:1 | Iconos o texto grande sobre blanco |
| #856404 ocre oscuro | 5,49:1 | 3,82:1 | Texto normal sobre blanco |
- ✓No uses amarillo para texto sobre blanco; si necesitas un texto «amarillo», oscurécelo hasta un ocre que supere 4,5:1.
- ✓En botones amarillos, escribe el texto en negro o en un gris muy oscuro, no en blanco.
- ✓Para avisos, combina un fondo amarillo claro con texto oscuro y un icono, no solo el color.
- ✓No transmitas información solo con el color: añade texto o iconos para quien no distingue bien los tonos.
- ✓Comprueba cada combinación con un verificador de contraste antes de aprobar la paleta.
05 Cómo usar el amarillo en tu marca y en tu web
-
1
Elige el tono por lo que quieres transmitir
Limón para energía, mostaza para un aire artesanal, dorado para calidad. Cada tono cambia el mensaje.
-
2
Define su papel en la paleta
Decide si el amarillo es color principal, de acento o solo de avisos. Un acento amarillo en botones clave suele funcionar mejor que una web entera amarilla.
-
3
Crea variantes accesibles
Añade un amarillo oscuro para texto e iconos sobre blanco y documenta qué combinaciones están permitidas.
-
4
Pruébalo en pantalla y en papel
El amarillo cambia mucho entre monitores e impresoras. Valida los códigos RGB, CMYK y Pantone.
-
5
Mide el resultado
Si cambias el color de un botón, compara la conversión antes y después con datos reales, no con intuiciones.
Una cadena de panaderías tiene como color principal un amarillo #FFCC00. En su web lo aplica como fondo de la cabecera y de los botones de pedido, con texto negro, y crea un ocre #856404 para los enlaces sobre fondo blanco. Resultado: la web se reconoce al instante y todos los textos superan el contraste AA. Es el tipo de decisión que resolvemos al plantear un diseño web profesional, apoyado en un sistema de color que cuide la experiencia de usuario.
Si estás creando o renovando tu marca, un estudio de diseño gráfico puede ayudarte a construir una paleta que funcione a la vez en el logotipo, en el punto de venta y en pantalla.
Preguntas frecuentes sobre Yellow
Significa amarillo. Es el color situado entre el verde y el naranja en el espectro visible, con longitudes de onda de unos 575 a 585 nanómetros.
Aproximadamente «iélou», con el acento en la primera sílaba.
Suele asociarse a optimismo, alegría, energía y llamada de atención; combinado con rojo, a rapidez y precios bajos. Las asociaciones cambian según la cultura, el tono y el contexto.
No hay un color que venda más en todos los casos. Un botón destaca por el contraste con el resto de la página, no por su color en sí; la única forma fiable de saberlo en tu web es un test A/B con tráfico real.
Entre las más conocidas están McDonald's, IKEA, DHL, Snapchat, National Geographic y, en España, Correos. Casi todas lo usan como fondo o símbolo y no para textos largos.
En general, no. El amarillo puro sobre blanco tiene un contraste de 1,07:1 y WCAG pide 4,5:1 para texto normal. Solo un amarillo muy oscuro, casi ocre, llega a ese mínimo.
El negro o un gris muy oscuro. El blanco sobre amarillo suele suspender el contraste mínimo; el azul oscuro o el rojo oscuro pueden funcionar si se comprueba la combinación.
El amarillo puro en web es #FFFF00 (RGB 255, 255, 0). Las marcas suelen usar tonos propios, como #FFCC00, definidos en su manual de identidad.
Yellow es el amarillo en general; gold es el dorado, un amarillo más cálido y oscuro que imita el oro. En branding, el dorado suele transmitir tradición o lujo, y el amarillo limpio, energía y cercanía.
Fuentes consultadas
Sobre el autor
Marketing Manager en appyweb
Dirige la estrategia de marketing digital, contenidos y redes sociales de los clientes de appyweb.
Ver perfil y artículos → Ver perfil en LinkedIn ↗