Mejores combinaciones de blanco, verde y amarillo: códigos hex y consejos

Blanco, verde y amarillo es una paleta predilecta cuando quieres que los diseños se sientan limpios, frescos e instantáneamente positivos. Combina claridad (blanco), naturaleza y equilibrio (verde), y una calidez llamativa (amarillo).

A continuación tienes 20 paletas de colores blanco, verde y amarillo listas para usar con códigos HEX, además de consejos prácticos para UI, branding y flujos de trabajo para impresión.

Por qué las paletas blanco, verde y amarillo funcionan tan bien

Las paletas de blanco, verde y amarillo se sienten “naturalmente modernas” porque reflejan señales del mundo real: luz limpia, follaje y sunlight. Por eso, son especialmente efectivas para marcas de bienestar, sostenibilidad, alimentación y actividades al aire libre.

Funcionalmente, el blanco te da espacio y legibilidad, el verde aporta tonos medios estables para superficies de UI y elementos de marca, y el amarillo crea acentos de alta visibilidad para CTAs, destacados e información clave.

También escalan bien de digital a impresión: mantén el blanco dominante, elige un verde principal para consistencia y usa el amarillo como un foco para que los diseños permanezcan calmados y no saturados.

Más de 20 ideas de paletas blanco, verde y amarillo (con códigos HEX)

1) Pradera Cítrica

HEX: #fbfbf6 #cfe8c9 #6fbf7a #f2d34f #2f5f43

Ambiente: fresco y optimista

Ideal para: identidad de marca ecológica y diseño de etiquetas

Fresco y optimista, transmite la sensación de un picnic soleado sobre hierba nueva con limonada cerca. Usa el tono crema pálida como espacio de respiro y deja que el verde suave cubra la mayoría de superficies. El amarillo dorado funciona mejor como acento para sellos, iconos o declaraciones clave de productos. Combina con texturas de papel sin recubrimiento y tipografía sans simple, y reserva el verde oscuro para texto pequeño pero de alto contraste.

Ejemplo de imagen de pradera cítrica generado usando media.io

Media.io

Media.io es un estudio AI en línea para crear y editar video, imagen y audio en tu navegador.

Pruébalo gratis ahora

2) Salvia Limonada

HEX: #ffffff #e7f2e3 #9cc79a #ffe36a #4a7a57

Ambiente: tranquilo y limpio

Ideal para: UI de app de salud y pantallas de onboarding

Tranquilo y limpio, evoca limonada fría con hierbas flotando en la superficie. Como paleta blanco, verde y amarillo, funciona bien cuando el blanco se mantiene dominante y la salvia se convierte en color de sistema para botones y estados. Usa el amarillo más brillante con moderación para notificaciones, progreso o pequeñas insignias y así evitar fatiga. Combina con sombras suaves y espacios generosos, y prueba el contraste para accesibilidad en el verde medio.

Ejemplo de imagen de salvia limonada generado usando media.io

3) Primavera Alpina

HEX: #f8faf7 #d7f0d6 #7fbf8f #f6dd59 #1f4a36

Ambiente: nítido y de exterior

Ideal para: cartel de viaje y flyers de eventos

Nítido y de exterior, evoca aire de montaña, flores silvestres y senderos iluminados por el sol. Mantén los tonos claros como fondo para imitar cielo abierto y papel. Reserva el verde profundo para títulos y detalles de ruta, así el diseño sigue siendo legible a distancia. Un toque de amarillo en fechas o llamados da energía al layout sin volverlo estridente.

Ejemplo de imagen de primavera alpina generado usando media.io

4) Herbario Soleado

HEX: #fffdf4 #e3f6e6 #8ed09c #ffd85a #355f45

Ambiente: aireado y botánico

Ideal para: sets de ilustración botánica en acuarela

Aireado y botánico, evoca hojas prensadas sobre papel cálido con brillo de media mañana. Deja que la crema y el lavado de verde pálido ocupen la mayor parte del lienzo para esa suavidad herbal. Usa amarillo como un acento tipo polen en brotes, etiquetas o formas pequeñas. Para un set cohesivo, mantén contornos en verde profundo y evita introducir negros fuertes.

Ejemplo de imagen de herbario soleado generado usando media.io

5) Menta y Caléndula

HEX: #fbfffe #d9f7ef #52bfa7 #ffc94a #2b6b55

Ambiente: juguetón y brillante

Ideal para: menú de café de verano y señalización de mesa

Juguetón y brillante, sugiere ramas de menta junto a pétalos de caléndula y bebidas heladas. Usa la menta fría como tono de fondo para que el amarillo cálido brille en precios y encabezados de secciones. El verde profundo ancla la tipografía y evita que el layout parezca demasiado dulce. Consejo: el amarillo debe ir en formas planas y no en texto grande para una legibilidad más limpia.

Ejemplo de imagen de menta y caléndula generado usando media.io

6) Lino y Lima Intensa

HEX: #f7f2e8 #e2f1d3 #8bcf66 #f5e26c #5a6a3f

Ambiente: cálido y natural

Ideal para: tema de blog de bienestar y diseño web de estilo de vida

Cálido y natural, evoca tela de lino, piel de lima y encimeras iluminadas por el sol. En esta paleta, comienza con la base de lino para secciones y tarjetas, utiliza el verde césped para enlaces y botones principales. El amarillo suave funciona mejor como énfasis para citas o marcas de listas. Combina con encabezados serif redondeados y reserva el olivo oscuro para navegación y pies de página.

Ejemplo de imagen de lino y lima intensa generado usando media.io

7) Bosque y Crema de Mantequilla

HEX: #fffaf1 #e6f3e6 #4f9f6d #f2cf57 #1f3f2f

Ambiente: acogedor y fundamentado

Ideal para: empaque de alimentos artesanales y etiquetas de frascos

Acogedor y fundamentado, recuerda un paseo por el bosque seguido de pan tostado con mantequilla y té con miel. Usa el tono crema para la base de la etiqueta, manteniendo el empaque premium y amigable. El verde medio funciona de maravilla para marcas y ingredientes destacados, mientras que el verde profundo debe llevar el texto legal y códigos de barras. Consejo: añade borde o sello amarillo fino para resaltar el panel frontal en estanterías sin añadir saturación.

Ejemplo de imagen de bosque y crema de mantequilla generado usando media.io

8) Flor de Pera

HEX: #ffffff #eef8e8 #a7d8a2 #ffe88a #3f6b4c

Ambiente: delicado y romántico

Ideal para: suite de invitaciones de boda de primavera

Delicado y romántico, evoca flores de pera, verdes suaves y brillo cálido de tarde. Mantén el fondo de la invitación brillante y limpio, luego superpone verdes pálidos en bordes o florales sutiles. El amarillo funciona mejor como acento pequeño en monogramas o sellos de cera. Para impresión, elige papel ligeramente texturizado y reserva el verde oscuro para nombres y detalles clave.

Ejemplo de imagen de flor de pera generado usando media.io

9) Narciso con Rocío

HEX: #f9fffb #dcf7de #74c08a #ffda3a #2d5c3f

Ambiente: enérgico y estimulante

Ideal para: gráficos de campañas en redes sociales

Enérgico y estimulante, parece rocío sobre hojas con un estallido de narciso al sol. Estas combinaciones funcionan mejor cuando eliges un verde dominante y dejas que el amarillo enfatice el mensaje. Usa blanco roto como respiro para que las publicaciones no resulten saturadas. Consejo práctico: pon el amarillo detrás de líneas de texto cortas o iconos, no como fondo completo.

Ejemplo de imagen de narciso cubierto de rocío generado usando media.io

10) Rayo de Oliva

HEX: #fcfbf7 #e9f2d6 #9bb65a #f6d05c #4d5a2a

Ambiente: rústico y seguro de sí mismo

Ideal para: anuncios de productos de equipo para exteriores

Rústico y seguro de sí mismo, evoca ramas de olivo, lona y la luz del sol sobre metal desgastado. Apóyate en el color oliva para los nombres de productos y características clave, luego usa el amarillo rayo de sol para guiar la vista hacia los precios o los llamados a la acción. Los tonos pálidos ayudan a que el anuncio se vea premium en lugar de táctico. Combínalo con tipografía condensada en negrita y deja márgenes generosos para que la composición se mantenga limpia.

Ejemplo de imagen de rayo de oliva generado usando media.io

11) Jardín de Té

HEX: #fffef9 #e6f5de #8fcb8e #ffe06b #2c5a3d

Ambiente: suave y calmante

Ideal para: diseño editorial de revistas y espacios para recetas

Suave y calmante, sugiere un tranquilo jardín de té con hojas frescas y rodajas de limón. Como una paleta de colores blanco-verde-amarillo, destaca en páginas editoriales donde los márgenes blancos permanecen amplios y aportan serenidad. Usa el verde medio para subtítulos y reglas de citas, y aplica el amarillo solo en pequeños marcadores como números de página o iconos de ingredientes. Consejo: mantén las fotos ligeramente cálidas para que la paleta se sienta coherente y no clínica.

Ejemplo de imagen de jardín de té generado usando media.io

12) Cítricos Recién Cortados

HEX: #ffffff #e9ffe9 #63c26e #ffe14f #2e6a38

Ambiente: vibrante y moderno

Ideal para: página de inicio de startup y sección principal de saas

Vibrante y moderno, se siente como rodajas frescas de cítricos sobre verdes vivos. Usa blanco para el fondo principal y deja que el verde brillante sea el protagonista en los llamados a la acción y enlaces. El amarillo es el acento perfecto para insignias, resaltados y pequeñas micro-interacciones. Para el equilibrio, utiliza el verde oscuro solo en encabezados y evita usarlo en bloques grandes.

Ejemplo de imagen de cítricos recién cortados generado usando media.io

13) Bambú y Tiza

HEX: #f6f7f3 #ddebd6 #86b788 #f3dc72 #3a5a3f

Ambiente: minimalista y consciente

Ideal para: plantillas para presentaciones y pitch decks

Minimalista y consciente, recuerda las sombras del bambú en una pared calcárea con un rayo de luz cálido. Usa el blanco tiza para los fondos de las diapositivas para mantener el contenido legible y moderno. El verde medio funciona bien para gráficos y divisores de secciones, mientras que el amarillo es mejor para uno o dos datos clave destacados por diapositiva. Consejo: mantén los diagramas simples y confía en el espacio en vez de utilizar bordes pesados.

Ejemplo de imagen de bambú y tiza generado usando media.io

14) Helecho Mielado

HEX: #fffdf7 #e4f6e1 #6fb07b #f3c95c #2c4f3a

Ambiente: acogedor y terroso

Ideal para: branding de restaurantes y empaques para llevar

Acogedor y terroso, evoca helechos en sombra con un toque de miel bajo el sol. Haz del blanco roto la superficie principal para que menús y cajas se vean limpios. Usa el verde para logotipos y navegación, y reserva el amarillo para sellos o elementos destacados. Combínalo con texturas de papel kraft y evita acabados brillantes para un aspecto más auténtico.

Ejemplo de imagen de helecho mielado generado usando media.io

15) Crema de Apio

HEX: #fffdfc #eef7e6 #b8d39b #ffe27a #5a6f45

Ambiente: ligero y accesible

Ideal para: hojas de actividades educativas para niños e imprimibles para el aula

Ligero y accesible, se siente como hojas de apio y crema de vainilla con un acento soleado. Mantén los fondos mayormente blancos para reducir el uso de tinta y conservar la claridad. Usa los verdes suaves para secciones y bordes y reserva el amarillo para estrellas, recompensas e instrucciones clave. Consejo: configura el texto principal en el verde oliva más oscuro para que las fotocopias sean legibles.

Ejemplo de imagen de crema de apio generado usando media.io

16) Algodón Chartreuse

HEX: #ffffff #eaf9e2 #9fe06c #ffe257 #3e6b2f

Ambiente: atrevido y juvenil

Ideal para: póster de streetwear y lanzamiento de merchandising

Atrevido y juvenil, parece tela chartreuse sobre algodón limpio con un foco brillante. Usa el verde llamativo en grandes bloques para máximo impacto y el blanco como contrapeso claro. El amarillo puede ser un acento secundario para fechas de lanzamiento, precios o stickers pequeños. Consejo: limita el texto principal al verde oscuro para que el póster sea legible a distancia.

Ejemplo de imagen de algodón chartreuse generado usando media.io

17) Polen y Pistacho

HEX: #fbfff8 #e3f4df #9bd3a8 #ffd24d #2b5b43

Ambiente: primaveral y amigable

Ideal para: diseño de newsletter por correo electrónico

Primaveral y amigable, sugiere helado de pistacho con un destello amarillo polen. Estas combinaciones de colores blanco-verde-amarillo son fáciles de manejar en email cuando el blanco es la base de la composición. Usa los tonos pistacho en encabezados de secciones y botones, y reserva el amarillo para un único llamado a la acción destacado o una insignia de tiempo limitado. Consejo: usa verde oscuro para todo el texto del párrafo para evitar que en la bandeja de entrada aparezca deslavado o con bajo contraste.

Ejemplo de imagen de polen y pistacho generado usando media.io

18) Brote de Limón

HEX: #ffffff #f1fbe9 #7ed28d #ffea61 #2f6a3d

Ambiente: brillante y esperanzador

Ideal para: página de aterrizaje de campaña para ONG

Brillante y esperanzador, se siente como pequeños brotes abriéndose paso a través de la tierra hacia un sol de limón. Usa el verde pálido como fondo suave de sección para dividir páginas largas sin añadir peso. El amarillo es un acento convincente para donativos o registros cuando se usa en un solo botón principal por pantalla. Consejo: pon los encabezados en verde oscuro y usa mucho espacio en blanco para que los mensajes inspiren confianza.

Ejemplo de imagen de brote de limón generado usando media.io

19) Patio de Jardín

HEX: #fdfcf8 #e6f2dc #8abf7d #f7d25b #3b5b38

Ambiente: relajado y acogedor

Ideal para: presets de fotografía para blogs de hogar y jardinería

Relajado y acogedor, recuerda un patio de jardín con sombra de follaje y piedra calentada por el sol. Mantén los resaltados cremosos en vez de blanco puro para mantener una apariencia natural en las fotos. Los verdes funcionan bien para realzar el follaje, mientras que el amarillo puede iluminar áreas soleadas y lámparas de interior sin virar a naranja. Consejo: usa verdes más oscuros solo para sombras y así evitar contrastes fangosos.

Ejemplo de imagen de patio de jardín generado usando media.io

20) Matcha Minimalista

HEX: #ffffff #edf6ef #a6c9b0 #ffe067 #2f4b3a

Ambiente: moderno y sereno

Ideal para: interfaz de panel de productividad

Moderno y sereno, recuerda la espuma de matcha en una taza blanca con una rodaja de limón al lado. Usa el verde más pálido para paneles y tarjetas para que la interfaz se sienta tranquila incluso con muchos datos. El amarillo puede funcionar como indicador de estados para plazos o alertas, mientras que el verde oscuro mantiene las etiquetas claras. Consejo: evita usar amarillo en textos largos y limítalo a iconos, puntos y etiquetas cortas.

Ejemplo de imagen de matcha minimalista generado usando media.io

¿Qué colores combinan bien con blanco, verde y amarillo?

Los neutros son las combinaciones más fáciles: añade tonos beige cálido o lino para una sensación natural y de estilo de vida, o utiliza un gris claro frío para que una UI se vea más tecnológica sin sacrificar la limpieza de la paleta.

Para contraste, el azul marino profundo y el carbón combinan bien con acentos verde-amarillo y mejoran la legibilidad de textos largos. Si buscas una apariencia más suave, el rosa empolvado o terracota pueden equilibrar la frescura con una calidez humana y artesanal.

En impresos y empaques, considera añadir marrón kraft o negro mate en pequeñas dosis (como reglas, sellos o textos legales) para darle base a la composición sin opacar el alegre amarillo.

Cómo usar una paleta blanco, verde y amarillo en diseños reales

Empieza por la jerarquía: deja el blanco como base, elige un verde como color principal de tu marca/UI y utiliza el amarillo como “color de atención” para un solo propósito (CTA, sello o resaltado). Así el diseño se mantiene nítido y el amarillo no sobrecarga la composición.

Para accesibilidad, evita texto amarillo sobre blanco y prueba el contraste para verdes medios en botones o enlaces. Si un verde no supera el contraste, oscurece para texto o añade un borde/blanco relleno para botones y mantener la legibilidad.

En branding e impresión, usa blanco roto (crema/lino) en lugar de blanco puro para una sensación más premium y conserva el verde oscuro para detalles como ingredientes, pies de foto o etiquetas de navegación.

Crea visuales de paletas blanco, verde y amarillo con IA

Si ya tienes códigos HEX, puedes convertirlos en imágenes concepto consistentes—tableros de marca, maquetas de UI, carteles, etiquetas o plantillas sociales—describiendo la composición y especificando el estado de ánimo de tu paleta.

Media.io te facilita generar ejemplos de imágenes rápidamente, iterar en estilo (minimalista, acuarela, editorial, UI moderna) y mantener los resultados alineados con tu esquema de color blanco-verde-amarillo.

Siguiente: Paleta de colores deportivos