Amarillo: significado, paletas, colores complementarios y armonías
Una guía práctica para el color. amarillo: simbolismo y psicología, el rueda de color relaciones (complementarias, análogas, triádicas), accesible combinaciones de coloresy paletas descargables. Convertir entre MALEFICIO, RGB, y HSL, copie variables CSS y obtenga una vista previa de los colores coincidentes que van juntos.
Consejo: presione Ingresar dentro de cualquier campo para actualizar todos los valores.
Amarillo de un vistazo
El amarillo indica sol, calidez, curiosidad y optimismo. Destaca como color de acento para resaltar llamadas a la acción, etiquetas de precios y alertas. Para lecturas largas, prefiera tonos más suaves para mayor comodidad.
El amarillo puro tiene poco contraste con el blanco. Para una interfaz de usuario fácil, coloque amarillo sobre azul marino, carbón o violeta intenso. Utilice texto negro o gris muy oscuro sobre fondos de color amarillo pálido.
Paletas Amarillas
Generado automáticamente tintes (más blanco), sombras (más negro), y tonos (más gris) del amarillo actual. Haga clic en cualquier muestra para copiar HEX. También puedes descargar una paleta PNG.
tintes
Sombras
Tonos
Armonías de la rueda de colores
Explorar complementario pares de colores, análogo vecinos, y triádico conjuntos de este amarillo. Estas combinaciones ya hechas te ayudarán a encontrar colores que combinen bien.
Los colores opuestos en la rueda de colores crean un alto contraste para las llamadas a la acción y las insignias.
Los vecinos al volante se sienten armoniosos, ideal para fondos y degradados.
Tres tonos espaciados uniformemente ofrecen un contraste equilibrado para paneles y gráficos.
Aplicaciones y mejores prácticas
Herrada
El amarillo aporta simpatía y energía a las marcas minoristas, de alimentación, de productos para niños y de viajes. Combínalo con carbón o azul marino intenso para lograr un equilibrio profesional y una tipografía legible.
Interfaz de usuario y accesibilidad
Utilice el amarillo como acento para los botones y las luces. Para contenido extenso, elija tonos pálidos como fondos con texto oscuro para cumplir con el contraste WCAG.
Comercialización y embalaje
El amarillo llama la atención en los estantes y en las redes sociales. Los azules o morados complementarios crean secciones de héroes y tarjetas de productos llamativas.
Características
- Instante HEXAGONAL ↔ RGB ↔ HSL conversión y sincronización.
- Paletas automáticas: tintes, sombras, tonos y una paleta PNG descargable.
- Armonías del círculo cromático: sugerencias complementarias, análogas y triádicas.
- Rápido variables CSS exportación para sistemas de diseño.
Cómo utilizar
- Introduzca un HEX (p. ej.
#FFD600) o valores RGB/HSL y presione Ingresar. - Haga clic en cualquier muestra para copiar su HEX. Utilice conjuntos complementarios o triádicos para lograr un fuerte contraste.
- Descargue la paleta PNG o copie las variables CSS y péguelas en su proyecto.
- Consulte las sugerencias de contraste para mantener el texto legible en las IU de color amarillo claro.
Preguntas frecuentes
¿Cuáles son los colores que combinan bien con el amarillo?
El azul marino, el carbón, el violeta intenso y el verde bosque intenso combinan muy bien. Para acentos brillantes, use azul cian o violeta complementarios.
¿Cuál es el color opuesto al amarillo?
En una rueda RGB/HSL, el tono opuesto está cerca azul-cian (alrededor de 180° del tono amarillo).
¿Puedo usar amarillo para el cuerpo del texto?
Generalmente no en fondos claros. Mantenga el amarillo para resaltados o íconos; en su lugar, utilice texto oscuro en una tarjeta de color amarillo pálido.