Combinaciones de colores azul, verde y marrón: 23 ejemplos con códigos hex y diseño AI

Una paleta de colores azul, verde y marrón es una de las formas más simples de combinar lo “fresco” con lo “terrenal” en el mismo diseño. Los tonos teal y oceánicos aportan claridad, mientras los neutros de madera y tierra agregan calidez y confianza.

Desde marcas rústicas modernas hasta pantallas de interfaz tranquilas e interiores acogedores, estas combinaciones siguen siendo versátiles porque equilibran temperatura fría y cálida, además de contraste entre claro y oscuro.

Por qué las paletas azul, verde y marrón funcionan tan bien

Los matices azul-verde (teal, espuma de mar, azul-verde profundo) naturalmente transmiten frescura, agua y calma—perfecto para interfaces y marcas que buscan claridad sin parecer estériles. También suelen lucir “limpios” tanto en digital como impreso.

Los tonos marrones agregan el elemento humano y táctil: madera, cuero, arcilla, café o tierra. Esa calidez hace que el teal sea más accesible y premium, especialmente si se fundamenta la paleta con un negro profundo para la tipografía.

Juntos, azul verde y marrón crean un equilibrio confiable entre cálido y frío que funciona durante todas las estaciones y estilos—desde minimalismo costero hasta albergue moderno—manteniendo suficiente contraste para un diseño accesible.

Más de 20 ideas de paletas azul, verde y marrón (con códigos HEX)

1) Cedro Costero

HEX: #1B6F7A #2E9BA3 #A7D8D1 #8B6B4E #2B2A28

Ambiente: fresco, terrenal, costero

Ideal para: identidad de marca para una empresa de vida al aire libre

El aire marino fresco se encuentra con cedro calentado por el sol, equilibrando los tonos azul-verde con maderas seguras. Funciona maravillosamente para marcas al aire libre, cafés y empaques que buscan un aire limpio pero natural. Combínalo con blanco cálido y una tipografía sans serif sencilla para mantenerlo moderno. Consejo de uso: utiliza el carbón oscuro para textos y reserva el aqua claro para destacados y insignias.

Ejemplo visual de cedro costero generado con media.io

Media.io

Media.io es un estudio online de IA para crear y editar video, imagen y audio en tu navegador.

Pruébalo gratis ahora

2) Sendero Ribereño

HEX: #0F4C5C #2A7F62 #9CC9B7 #B48A61 #3B2F2A

Ambiente:aventurero, natural, calmado

Ideal para:estilos de sección y hero de sitio web para blog de viajes

Aventurero y calmado, como un sendero sombreado a la orilla de un río con bancos de arcilla y aguas profundas. Estos tonos funcionan bien en diseños web porque el azul-verde oscuro fundamenta los títulos y el menta suave sostiene secciones espaciosas. Combínalo con fondos blanco apagado y divisores gris cálido para evitar contrastes fuertes. Consejo de uso: mantén las fotos ligeramente desaturadas para que la paleta siga controlada.

Ejemplo visual de sendero ribereño generado con media.io

3) Estudio Vintage

HEX: #123B4A #2F7C7A #C7E3DC #7A5A3C #E8D8C6

Ambiente:clásico, erudito, acogedor

Ideal para:maquetación de artículo editorial para revista

Clásico y erudito, como un estudio vintage con tela de libros teal y cuero gastado. Esta paleta azul verde marrón resalta en diseño editorial donde se busca autoridad sin sensación fría. Usa el crema como base de papel y el teal más oscuro para encabezados y citas visibles. Consejo de uso: mantén el texto principal casi negro y usa marrón solo como acento premium.

Ejemplo visual de estudio vintage generado con media.io

4) Cabaña junto al Lago Alpino

HEX: #0B2F3A #1F6A6E #77B7B0 #6E5138 #D9D2C7

Ambiente:tranquilo, nítido, rústico

Ideal para:UI de listado y pantallas de reserva para cabañas

Tranquilo y nítido, como un lago alpino junto a una cabaña de madera al amanecer. El rango teal apagado mantiene interfaces calmadas y los marrones agregan calidez y confianza al flujo de reservas. Combínalo con mucho espacio en blanco y esquinas suavemente redondeadas para una bienvenida cálida. Consejo de uso: usa el tono piedra claro para fondos y reserva los botones primarios en teal medio para claridad.

Ejemplo visual de cabaña junto al lago alpino generado con media.io

5) Terracota Musgosa

HEX: #205B63 #4C8C7A #BFDCCF #A06B4F #3A3A34

Ambiente:terrenal, artesanal, cálido

Ideal para:empaque y etiquetas para productos de cerámica

Terrelnal y artesanal, como musgo en macetas de barro tras una lluvia ligera. Los tonos verde-azul hacen que la terracota cálida sea más sofisticada, no solo rústica. Combínalo con papeles texturizados y un sello sencillo para un aspecto auténtico. Consejo de uso: imprime el tono más oscuro en textos pequeños para que las etiquetas sean legibles en materiales kraft.

Ejemplo visual de terracota musgosa generado con media.io

6) Surf y Silla de Montar

HEX: #0E5B6E #2CA7A5 #D2F0EA #8A5C3C #1C1B1A

Ambiente:audaz, deportivo, seguro

Ideal para:anuncio de producto para smartwatch resistente

Audaz y deportivo, como salpicaduras de surf sobre equipamiento de cuero gastado. El teal vívido aporta energía, mientras el marrón silla de montar mantiene el look rudo y premium. Combina con fotografía de alto contraste y copiado mínimo para que el color sea protagonista. Consejo de uso: usa el aqua pálido como resplandor o destaque UI, pero no de fondo completo para evitar blanquear el anuncio.

Ejemplo visual de surf y silla de montar generado con media.io

7) Correo Botánico

HEX: #164B5B #3A8576 #B7D7C8 #C2A07C #F4EFE7

Ambiente:botánico, delicado, vintage

Ideal para:suite de invitaciones botánicas en acuarela

Botánico y delicado, como hojas prensadas dentro de un sobre antiguo. Estas combinaciones azul verde marrón lucen especialmente elegantes utilizadas con florales en acuarela y tonos suaves de papel. Combina con título serif y script claro para nombres, manteniendo el contraste sutil y elegante. Consejo de uso: deja que el crema lidere como espacio negativo y usa el beige para bordes y pequeños motivos.

Ejemplo visual de correo botánico generado con media.io

8) Pátina de Museo

HEX: #0C3C49 #2F6F6D #8FC2B7 #6A4B34 #CFC7BC

Ambiente:atemporal, refinado, apagado

Ideal para:serie de carteles de exhibición de museo

Atemporal y refinado, como bronce envejecido junto a madera pulida en una tranquila galería. El teal apagado aporta sofisticación y deja que la tipografía sea protagonista. Combina con una cuadrícula fuerte, márgenes generosos y un color de acento utilizado consistentemente en la serie. Consejo de uso: mantiene tonos de fondo mate y evita blancos brillantes para una sensación más de archivo.

Ejemplo visual de pátina de museo generado con media.io

9) Fogata y Denim

HEX: #1A4F6A #2F7D7C #A9D6D2 #9A6A48 #2F2A26

Ambiente: acoger, al aire libre, robusto

Ideal para: tablero de menús y señalización de cafetería

Acogedor y robusto, como chaquetas de mezclilla alrededor de una fogata y vapor de un café recién hecho. El azul profundo mantiene los menús legibles, mientras que el marrón cálido resalta apetitosos detalles. Combina con texturas de tiza o un grano sutil para una sensación artesanal. Consejo de uso: usa el azul agua claro solo para llamados pequeños para que la pizarra no se vea pastel.

Ejemplo de imagen de denim junto a la fogata generado con media.io

10) Biblioteca Silenciosa

HEX: #13323B #2C6E73 #9AC0BB #7B5C44 #EFE7DD

Ambiente: tranquilo, intelectual, reconfortante

Ideal para: interfaz de onboarding y paywall para app de lectura

Tranquilo e intelectual, como la luz suave sobre antiguas estanterías y una sala de lectura silenciosa. Los tonos teal otorgan a las pantallas digitales una cualidad relajante, mientras que el marrón añade calidez humana. Combina con fondos cremosos y buen interlineado para una lectura fácil. Consejo de uso: reserva el tono más oscuro para texto principal e íconos para mantener un buen contraste.

Ejemplo de imagen de biblioteca silenciosa generado con media.io

11) Taller del Pacífico

HEX: #0F5668 #1F8A86 #BFE7DF #7C5134 #F7F2EA

Ambiente: limpio, artesanal, moderno

Ideal para: landing page para un estudio de muebles artesanales

Limpio y enfocado en el artesano, como un taller del Pacífico con aserrín, brisa marina y maderas bien apiladas. Esta combinación azul-verde-marrón se siente moderna al combinarse con fotografía de producto simple y mucho espacio en blanco. Deja que el teal maneje lo interactivo mientras el marrón permanece como guiño discreto a la madera real. Consejo de uso: usa el menta para estados hover y separadores sutiles de sección.

Ejemplo de imagen de taller del Pacífico generado con media.io

12) Cobertizo de Jardín

HEX: #194A4D #3E8E82 #D7EFE7 #B07D55 #4B3B2E

Ambiente: práctico, soleado, hogareño

Ideal para: póster de taller DIY y volante de clases

Práctico y soleado, como un cobertizo de jardín ordenado con herramientas pintadas y estantes de madera cálida. El teal aporta claridad a los títulos y el marrón caramelo lo hace accesible y amigable. Combina con íconos audaces y un layout simple de dos columnas para escaneo rápido. Consejo de uso: el menta pálido funciona como espacio negativo para que el volante respire.

Ejemplo de imagen de cobertizo de jardín generado con media.io

13) Costa Espresso

HEX: #0C4152 #1F7E83 #A2D4CF #4B2E23 #D9C7B5

Ambiente: melancólico, premium, costero

Ideal para: empaques de marca de cafetería y tarjetas de fidelidad

Melancólico y premium, como crema de espresso ante una costa lluviosa. El marrón profundo aporta mucha riqueza, mientras el azul verdoso lo mantiene fresco y contemporáneo. Combina con acabados mate y arte lineal minimalista para elevar la marca sin parecer recargada. Consejo de uso: usa el beige claro solo para fondos y reserva el tono espresso para logotipos y sellos.

Ejemplo de imagen de costa espresso generado con media.io

14) Vidrio de Mar Rústico

HEX: #0F3E46 #2D7D73 #C8E7DD #8E6A4A #F1E9DD

Ambiente: relajado, desgastado, acogedor

Ideal para: moodboard de interior de baño y guía de estilo

Relajado y desgastado, como vidrio de mar recogido en una canasta junto a madera flotante. Esta paleta azul-verde-marrón es ideal para interiores que buscan tranquilidad de spa sin ser fríos. Combina con piedra natural, latón cepillado y lino para un look por capas. Consejo de uso: repite el teal medio en dos o tres elementos pequeños de decoración para que el conjunto se sienta pensado.

Ejemplo de imagen de vidrio de mar rústico generado con media.io

15) Lodge Moderno

HEX: #0E2E36 #246B6F #7FB8B0 #A6794F #E6DDCF

Ambiente: rústico moderno, tranquilo, seguro

Ideal para: kit UI para web de reservas de hotel

Rústico moderno y tranquilo, como un lobby de lodge con líneas limpias, mantas de lana y madera pulida. Los tonos oscuros hacen que CTAs y la navegación sean sólidos, mientras el teal suave aporta luminosidad. Combina con neutros cálidos y sombras ligeras para un kit UI premium. Consejo de uso: limita los marrones acento a precios, valoraciones e íconos clave para evitar un diseño barroco.

Ejemplo de imagen de lodge moderno generado con media.io

16) Teal Bronce Minimal

HEX: #103741 #2E7B7E #B6DFD8 #7E5A3A #FAF6F0

Ambiente: minimalista, elegante, equilibrado

Ideal para: dashboard UI de SaaS con tarjetas de analíticas

Minimalista y elegante, como bronce cepillado junto a vidrio teal frío. La paleta sigue siendo legible en tableros porque ofrece un oscuro claro, un claro definido y dos acentos controlados. Combina con divisores finos, gráficos simples y gris neutro para texto secundario. Consejo de uso: usa el teal para estados activos y el marrón bronce solo para alertas o KPIs destacados.

Ejemplo de imagen de teal bronce minimal generado con media.io

17) Paseo Lluvioso

HEX: #0A3A44 #1D6B73 #8CC6C3 #9B7652 #2A2422

Ambiente: melancólico, cinematográfico, urbano-costero

Ideal para: portada de álbum y gráficos promocionales sociales

Melancólico y cinematográfico, como maderas mojadas en un paseo marítimo bajo luces teal. La base oscura da dramatismo y el medio teal y marrón cálido evitan la monotonía. Combina con grano, tipografía de alto contraste y formas geométricas mínimas para una estética musical moderna. Consejo de uso: mantén el texto en el tono más claro y evita el blanco puro para conservar el ambiente.

Ejemplo de imagen de paseo lluvioso generado con media.io

18) Arrecife Otoñal

HEX: #144C59 #2B8E8A #CFEDE6 #B06E45 #5A3B2B

Ambiente: vibrante, estacional, juguetón

Ideal para: cabecera de newsletter estacional e ilustraciones

Vibrante y estacional, como formas de coral flotando en agua teal clara con un toque de especia otoñal. Estas combinaciones azul-verde-marrón son ideales para newsletters porque transmiten energía sin ser neón. Combina con íconos ilustrados simples y fondo cálido blanco roto para leer fácilmente. Consejo de uso: reserva el marrón especiado para botones y enlaces clave para asegurar que los clics sean intencionales.

Ejemplo de imagen de arrecife otoñal generado con media.io

19) Diario de Campo

HEX: #0F3842 #2A706A #A7D1C4 #8C6848 #E9E1D6

Ambiente: reflexivo, natural, organizado

Ideal para: diseño de portada de libreta y juego de papelería

Reflexivo y natural, como un diario de campo lleno de bocetos y notas de ruta. Los verdes fríos dan enfoque, mientras que el marrón añade un toque artesanal y táctil. Combina con dibujos lineales mínimos, cuadriculado de puntos y texturas de papel reciclado. Consejo de uso: imprime el teal como color principal de portada y usa el marrón para detalles en el lomo y pequeñas marcas.

Ejemplo de imagen de diario de campo generado con media.io

20) Taller del Puerto

HEX: #0D3F4B #2C7E83 #B9E4DE #7A4E35 #F3EEE6

Ambiente: industrial, limpio, confiable

Ideal para: página de producto ecommerce para marca de herramientas

Industrial y confiable, como un taller de puerto con acero pintado y mangos aceitados. El teal apoya una sensación moderna y de confianza mientras el marrón denota durabilidad y oficio. Combina con fotos de producto definidas, tablas de especificaciones claras y una iconografía contenida. Consejo de uso: usa el tono más oscuro para títulos y el teal medio para estados de selección y pestañas.

Ejemplo de imagen de taller del puerto generado con media.io

21) Marea del Cañón

HEX: #0B3A47 #1F7B7D #9FD7D2 #B07A55 #3C2E2A

Ambiente: dinámico, aventurero, enérgico

Ideal para: póster de evento deportivo de trail run

Dinámico y aventurero, como pozas y rocas de cañón tras una tormenta. El contraste entre el teal frío y el marrón arenoso hace que los titulares resalten y mantiene el diseño deportivo. Combina con tipografía condensada audaz e íconos de ruta simples para comprensión rápida. Consejo de uso: coloca el teal claro detrás de bloques clave para mejorar la legibilidad sin usar blanco.

Ejemplo de imagen de marea del cañón generado con media.io

22) Helecho y Nogal

HEX: #123C3F #2E7C68 #C6E7DA #6B452F #EDE5D8

Ambiente: natural, premium, sereno

Ideal para: logo y sistema de empaque para marca de bienestar

Natural y sereno, como hojas de helecho sobre muebles de nogal pulido. Esta paleta azul-verde-marrón se siente premium para marcas wellness cuando el layout es aireado y la tipografía discreta. Combina con íconos lineales mínimos y mucho espacio crema para sugerir calma y cuidado. Consejo de uso: utiliza el tono nogal para el logo y deja que el verde-azulado aporte elementos y patrones secundarios.

Ejemplo de imagen de helecho y nogal generado con media.io

23) Spruce de Cobre Nocturno

HEX: #082A33 #155B5E #6CB2A5 #B06A3C #1A1615

Ambiente: oscuro, lujoso, dramático

Ideal para: menú para bar de cócteles de lujo y gráficos sociales

Oscuro y lujoso, como agujas de abeto en la noche con un brillo cobrizo a la luz de las velas. La base profunda crea dramatismo, mientras el verde azulado lo mantiene moderno y el marrón cobrizo aporta un toque apetecible. Úsalo para menús, promociones en redes sociales y señalización donde desees riqueza sin sobrecarga visual. Consejo de uso: agrega impresión metálica para el tono cobre y mantén el verde azulado como un delineado fino para evitar ruido visual.

Ejemplo de imagen de una noche de abeto cobrizo generado usando media.io

¿Qué colores combinan bien con azul verde marrón?

Los tonos cálidos entre blanco sucio y crema son los compañeros más fiables para paletas de verde azulado y marrón, porque mantienen los diseños luminosos sin volverse fríos. Piensa en marfil, blanco cálido, avena y piedra clara.

Para profundidad y legibilidad, añade tonos carbón casi negros en lugar de negro puro, especialmente para textos principales e iconos de interfaz. Si buscas una sensación “clásica” y suave, un gris cálido puede reemplazar divisores y bordes duros.

Como acentos, el latón/dorado cepillado, coral apagado o terracota pueden realzar la paleta cuando necesitas énfasis; solo limita los acentos para que el verde azulado siga siendo el protagonista y los marrones no se vuelvan apagados.

Cómo usar una paleta azul verde marrón en diseños reales

En diseño de UI, elige un solo verde azulado como color principal para acciones y deja los marrones como acentos secundarios (precios, etiquetas, iconos) en lugar de grandes fondos. Usa crema o piedra clara para las superficies, manteniendo así un aspecto moderno y sereno.

En branding y packaging, el verde azulado transmite frescura y confianza, mientras el marrón tipo nogal o espresso sugiere artesanía y calidad premium. Combina con tipografía limpia y mucho espacio en blanco para evitar la apariencia de “desorden rústico”.

En interiores, repite el tono medio de verde azulado en pequeños elementos (azulejos, toallas, arte) y ancla la habitación con tonos de madera (roble, nogal, cedro). Mantén los metales y textiles naturales (lino, latón cepillado) para conservar la esencia terrenal.

Crea visuales de paletas azul verde marrón con IA

Si vas a presentar un concepto o armar un moodboard, los visuales generados por IA te ayudan a previsualizar cómo se comportan las paletas verde azulado y marrón en diferentes materiales, iluminación y composiciones. Puedes probar rápidamente estilos “costero” versus “de cabaña” sin rediseñar desde cero.

Empieza con un sujeto claro (cartel, UI, envase, muestras de interiores), luego describe los materiales (papel kraft, etiqueta mate, lino, veta de madera) y mantén la paleta consistente en el prompt. Exporta algunas variantes para comparar contraste y jerarquía.

Media.io facilita generar maquetas basadas en paletas, luego iterar hasta que los tonos sean equilibrados y legibles.

Siguiente: Paleta de color Burdeos y Negro