20 Paletas de Colores Inspiradas en Días Lluviosos con Códigos Hex

Una paleta de colores para días lluviosos se compone de grises brumosos, azules suavizados y neutros cálidos apagados—tonos que transmiten calma, modernidad y facilidad para el diseño.

A continuación encontrarás 20 esquemas de color para días lluviosos cuidadosamente seleccionados (con códigos HEX) que puedes utilizar para UI, branding, packaging e impresión—además de indicaciones para generar visuales a juego en Media.io.

Por qué las paletas de días lluviosos funcionan tan bien

Los colores de día lluvioso son naturalmente tenues, lo que hace que se sientan pulidos y "diseñados" incluso en composiciones simples. Como los tonos tienen baja saturación, la tipografía y el espaciado toman protagonismo—perfecto para visuales modernos y minimalistas.

Estas paletas también crean profundidad instantánea. Los grises suaves y los azules pizarra forman capas de fondo fiables, mientras que una nota cálida (taupe, caramelo, terracota) evita que el diseño se sienta frío o demasiado corporativo.

Lo más importante: los esquemas de día lluvioso son flexibles en distintos medios. Se trasladan bien de pantalla a impresión y combinan estupendamente con fotografía monocromática, texturas y gradientes tranquilos.

Más de 20 ideas de paletas de colores para días lluviosos (con códigos HEX)

1) Acera Brumosa

HEX: #D9DEE3 #A9B1BA #6B7682 #3C444E #C8B7A6

Sensación: silencioso, brumoso, estable

Mejor para: UI minimalista para dashboard SaaS

Silenciosos y brumosos como pasos matutinos en una acera húmeda, estos tonos se sienten limpios sin volverse fríos. Usa el gris claro como lienzo y crea jerarquía con pizarra y carbón para navegación y gráficos. El taupe cálido mantiene la interfaz humana y evita que la paleta se perciba demasiado industrial. Consejo: reserva el carbón más profundo para CTAs clave y estados activos para mantener un contraste nítido.

Ejemplo de imagen de acera brumosa 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 ahora gratis

2) Umbrella Noir

HEX: #0F1115 #2B2F36 #5A606B #B7BDC6 #E6E1D6

Sensación:cinematográfico, elegante, alto contraste

Mejor para:branding de moda de lujo

Cinematográfico y elegante, evoca paraguas brillantes y luces urbanas reflejadas en calles mojadas. Deja que el casi negro y el grafito anclen logotipos, etiquetas y tipografía para una sensación premium. El gris pálido y el blanco cálido aportan espacio para composiciones editoriales y fotografía de producto. Consejo: combínalo con un solo foil metálico o barniz puntual para contraste táctil sin añadir nuevos colores.

Ejemplo de imagen de umbrella noir generado con media.io

3) Reflejo de Charco

HEX: #8FA3B6 #4E6A7D #2F3E4A #D7D2C8 #A4B58A

Sensación:fresco, reflexivo, aireado

Mejor para:encabezado de blog eco de estilo de vida

Fresco y reflexivo, se siente como el cielo pálido reflejado en un charco con un toque de hojas nuevas. Estas combinaciones de color para días lluviosos funcionan bien para encabezados de blogs donde buscas estructura calmada y un acento orgánico suave. Usa los azules-grises para texto y overlays, luego incorpora el verde musgo para botones o etiquetas. Consejo: mantén el beige como fondo para conservar calidez y legibilidad.

Ejemplo de imagen de reflejo de charco generado con media.io

4) Té tras las nubes

HEX: #F2EFEA #C9D2D7 #93A3AD #6B7A86 #B88C6A

Sensación:acogedor, suave, acogedor

Mejor para:diseño de menú de cafetería

Acogedor y suave, recuerda un té caliente junto a la ventana mientras las nubes se despejan lentamente. La base cremosa apoya textos largos, mientras los grises fríos agregan estructura para secciones y precios. Un acento de caramelo apagado es perfecto para resaltar especiales de temporada o iconos. Consejo: usa el caramelo con moderación para mantener el menú tranquilo y premium, no recargado.

Ejemplo de imagen de té tras las nubes generado con media.io

5) Asfalto Mojado

HEX: #1C2127 #343C45 #59636E #9AA4AF #D0D5DB

Sensación:urbano, estable, profesional

Mejor para:UI de landing page B2B

Urbano y estable, captura el aspecto fiable del asfalto húmedo bajo luz nublada. Usa los grises oscuros para encabezados y navegación para transmitir confianza y seguridad. Los tonos neutros más claros mantienen formularios y bloques legibles, especialmente en páginas largas. Consejo: añade espacios amplios y esquinas redondeadas para suavizar la paleta y evitar un aspecto pesado.

Ejemplo de imagen de asfalto mojado generado con media.io

6) Luz Acogedora de Ventana

HEX: #EFE6D8 #C8B6A6 #8B8F97 #4C565F #6F4B3E

Sensación:cálido, introspectivo, reconfortante

Mejor para:diseño de portada de libro

Cálido e introspectivo, parece la luz de ventana iluminando un sillón desgastado en una tarde lluviosa. Combina el beige cremoso con gris suave para títulos legibles y textura sutil. El profundo tono espresso añade peso literario para nombres de autor o elementos del lomo. Consejo: prueba una textura de papel para que los neutros se vean táctiles y no planos.

Ejemplo de imagen de luz acogedora de ventana generado con media.io

7) Jardín con Llovizna

HEX: #DDE6D6 #A7BCA0 #6F8A6B #3E5740 #5B6269

Sensación:botánico, calmado, restaurador

Mejor para:póster de ilustración botánica

Botánico y restaurador, sugiere hojas oscurecidas por la lluvia y senderos de piedra tras una llovizna suave. Estas combinaciones de color son ideales para pósters de naturaleza, marcas de bienestar y packaging que requieren una narrativa verde y estable. Usa la salvia pálida como espacio negativo y el verde bosque profundo para tallos, títulos o bordes. Consejo: mantén el gris frío como color de sombra para conservar profundidad sin añadir negro.

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

8) Niebla del Puerto

HEX: #E3E7EA #B8C1C8 #7D8E9C #3F5564 #2A333B

Sensación:fresco, náutico, sereno

Mejor para:diseño de folleto de viajes

Fresco y sereno, evoca un puerto silencioso envuelto en niebla con profundidad azul acero apagada. Los tonos claros hacen que los spreads fotográficos se vean aireados, mientras los azules profundos suman títulos y divisores seguros. Combina de forma natural con fotografía monocromática e iconos de mapas simples. Consejo: usa el tono más oscuro solo para texto pequeño cuando puedas mantener espaciado confortable entre líneas.

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

9) Pizarra y Abeto

HEX: #C7CED6 #6D7F8C #2F3A44 #2F4A3A #D6C6B3

Sensación:aventurero, estable, moderno

Mejor para:página de producto para equipo de exterior

Aventurero y estable, recuerda roca pizarra y agujas de abeto tras una lluvia constante. Usa la familia pizarra para especificaciones de producto y componentes UI, luego incorpora el verde abeto para botones principales o insignias. El tono arena cálida suaviza la temperatura general y funciona bien detrás de fotos de estilo de vida. Consejo: mantén el verde para pocas acciones clave de modo que se lea intencional, no decorativo.

Ejemplo de imagen de pizarra y abeto generado con media.io

10) Impermeable Metro

HEX: #F2F4F6 #B7C0C8 #4B5964 #F2C14E #2B2F33

Sensación: moderno, enérgico, “commuter-chic”

Mejor para: diseño de póster para evento

Moderno y “commuter-chic”, destaca con el toque de color de un impermeable sobre una plataforma gris. Esta paleta lluviosa es ideal cuando necesitas una base neutra con un acento optimista que capte la atención rápidamente. Usa el amarillo para el título del evento y detalles clave, mientras que los grises forman los bloques de fondo y el texto secundario. Consejo: mantén el amarillo en formas grandes y encabezados para que permanezca vibrante sin parecer ruidoso.

Ejemplo de imagen de impermeable metro generado con media.io

11) Vela en la Tormenta

HEX: #1E2328 #3F4A52 #8B949D #E7D7B8 #C77C5A

Sensación: melancólico, íntimo, resplandor cálido

Mejor para: empaque de vela artesanal

Melancólica e íntima, evoca la llama de una vela calentando un cuarto tormentoso. Usa carbón y pizarra como base de la etiqueta, y deja que el crema ceroso aporte un suave resplandor a la tipografía. Un terracota apagado queda perfecto para sellos, notas de aroma o pequeños detalles de patrón. Consejo: elige papel mate y deja el terracota sólo para áreas pequeñas para mantener un aspecto elegante y calmado.

Ejemplo de imagen de vela en la tormenta generado con media.io

12) Minimalismo de Día Lluvioso

HEX: #FFFFFF #E6EAEE #B9C2C9 #6F7C86 #2E353C

Sensación: limpio, aireado, directo

Mejor para: UI de onboarding app móvil

Limpio y aireado, sugiere luz brillante y nublada con bordes definidos. Usa blanco y gris pálido para pantallas que requieren claridad, luego baja hacia pizarra para encabezados e indicadores de progreso. El tono más oscuro es perfecto para texto primario y contornos de íconos. Consejo: añade un sutil degradado entre los dos colores más claros para que las pantallas planas no se sientan estériles.

Ejemplo de imagen de minimalismo de día lluvioso generado con media.io

13) Cacao y Concreto

HEX: #E9E0D6 #B8A89A #7A6F68 #3E3A38 #4A6A73

Sensación: terroso, urbano, acogedor-moderno

Mejor para: plantillas sociales para marca de café

Terroso y urbano, se siente como la calidez del cacao contra muros de concreto y sombras azul lluvia. El beige cremoso es perfecto para fondos y plantillas de historias, mientras los marrones cacao añaden esencia de marca. Un azul verdoso apagado te da un contrapunto más frío para stickers, precios o destacados. Consejo: usa pesos tipográficos consistentes para que la paleta luzca intencionada, no rústica.

Ejemplo de imagen de cacao y concreto generado con media.io

14) Trueno Suave

HEX: #D6D9DE #9FA8B3 #5A6673 #2C3440 #7B6D8D

Sensación: tormentoso, elegante, ligeramente onírico

Mejor para: set de invitaciones de boda

Tormentoso y elegante, evoca el trueno distante suavizado por la neblina y un toque de violeta crepuscular. Paleta ideal para invitaciones modernas donde buscas romance sin colores pastel azucarados. Usa el gris claro como tono de papel, pizarra para la tipografía y violeta para monogramas o sellos de cera. Consejo: imprime el violeta como color directo para mantener su riqueza y consistencia en todas las piezas.

Ejemplo de imagen de trueno suave generado con media.io

15) Pasteles Barquito de Papel

HEX: #F7F3EF #D9DCE8 #B8C7D6 #8FA0A8 #E3B7A0

Sensación: suave, nostálgico, tranquilo-juguetón

Mejor para: set de papelería infantil

Suave y nostálgico, se siente como barquitos de papel flotando en charcos. Usa el rubor para pequeñas ilustraciones y stickers, mientras los azul-grisados mantienen el set calmado y relajante. Combina bien con garabatos simples, tipografía redondeada y mucho espacio en blanco. Consejo: utiliza contornos en azul-gris medio para que el arte siga siendo liviano y no duro.

Ejemplo de imagen de pasteles barquito de papel generado con media.io

16) Póster Monzón

HEX: #0E2A3B #17465B #2E7C8A #A7C6C8 #E9E6DF

Sensación: audaz, costero, empapado por la lluvia

Mejor para: flyer para festival de música

Audaz y empapado, canaliza cielos de monzón acercándose al agua costera. Los azules profundos dan dramatismo para tipografía grande mientras el turquesa añade movimiento en formas y degradados. El verde mar pálido y blanco cálido facilitan la lectura aunque haya mucha información. Consejo: usa un degradado a dos colores entre turquesa y azul marino para un fondo dinámico sin sumar más matices.

Ejemplo de imagen de póster monzón generado con media.io

17) Mezclilla Lavada por la Lluvia

HEX: #E1E6ED #A9B7C9 #6D84A3 #3E556F #2B2F36

Sensación: casual, confiable, tonos fríos

Mejor para: anuncio de producto denim

Casual y confiable, luce como mezclilla oscurecida por la lluvia pero aún definida. Usa azul-gris pálido para el fondo y denims medios para bloques y balizas. El azul marino profundo y carbón resaltan nombres de producto y precios sin gritar. Consejo: mantén la tipografía monocromática y deja que los tonos denim cuenten la historia.

Ejemplo de imagen de mezclilla lavada por la lluvia generado con media.io

18) Flor de Tormenta

HEX: #2A2E35 #55606B #A9B3BC #D7D1C6 #B06A7A

Sensación: romántico, moderno, levemente dramático

Mejor para: empaque de cosméticos

Romántica y ligeramente dramática, se siente como pétalos contra un cielo tormentoso. Una paleta lluviosa con acento rosa empolvado es ideal para empaques de belleza que quieren suavidad sin perder carácter. Usa los grises como base para el sistema de etiquetas, y deja que el rosa lleve los nombres de tonos o sellos. Consejo: imprime el rosa sobre fondo beige cálido para mantener la sofisticación en vez de lo azucarado.

Ejemplo de imagen de flor de tormenta generado con media.io

19) Faro Tras la Lluvia

HEX: #F3F0E9 #C8D2D8 #6E7F8A #1F3B4D #C65A3A

Sensación: náutico, esperanzador, nítido

Mejor para: reporte anual sin fines de lucro

Náutico y esperanzador, sugiere la luz de un faro atravesando la lluvia persistente. Usa el blanco roto para lecturas prolongadas y encabezados en azul océano profundo para autoridad. El naranja-rojo apagado es un excelente acento para gráficos, destacados y métricas clave. Consejo: limita el acento sólo a una o dos series de datos para que los gráficos sigan siendo legibles de inmediato.

Ejemplo de imagen de faro tras la lluvia generado con media.io

20) Ventana de Autobús Nocturno

HEX: #0B0F14 #1F2A35 #3B556B #7A92A6 #D8D3C7

Sensación: nocturno, reflexivo, tranquilo-tecnológico

Mejor para: UI de app fintech en modo oscuro

Nocturno y reflexivo, evoca luces de calles cruzando la ventana de un bus por la noche. Usa casi negro y azul profundo como base para modo oscuro, elevando las superficies con pizarra y azul neblina para tarjetas. El neutro cálido claro funciona bien como punto destacado y en estados vacíos amigables. Consejo: utiliza el azul neblina para los aros de enfoque y mantener la accesibilidad sin recurrir a neón chillón.

Ejemplo de imagen de ventana de autobús nocturno generado con media.io

¿Qué colores combinan bien con días lluviosos?

Las paletas de días lluviosos combinan mejor con otros tonos apagados: blancos suaves, grises niebla, azules pizarra y verdes desaturados. Esto mantiene la composición calmada y legible, especialmente en UI y diseño editorial.

Para contraste, agrega un acento cálido como caramelo, terracota, rosa empolvado o naranja-rojo apagado. Los acentos cálidos funcionan muy bien cuando la base es fría (azul-gris/carbón), porque crean foco sin gritar.

Si buscas un aspecto más premium, combina neutros tormenta con casi negro más un blanco roto (en vez de blanco puro). Esa calidez sutil se siente más táctil en impresión y más cómoda en pantalla.

Cómo utilizar una paleta de colores de día lluvioso en diseños reales

Comienza con un fondo claro “nublado” (gris neblina o blanco roto cálido), luego elige un tono medio para la estructura (tarjetas, secciones, divisores) y un tono profundo para texto y navegación. Así mantienes la jerarquía clara incluso con colores sutiles.

Usa los acentos con intención: reserva el color más brillante o cálido para botones primarios, métricas clave o títulos. En esquemas lluviosos, un pequeño acento rinde mucho, permitiendo que el ánimo general se mantenga coherente.

Por último, recurre a la textura e imágenes. Grano, overlays de papel y fotografía monocromática enriquecen paletas apagadas—sin requerir saturación extra.

Crea visuales de paletas de día lluvioso con IA

Si quieres mockups a juego con la paleta (pósters, empaques, pantallas de UI), genéralos con IA usando un estilo de prompt consistente y la dirección HEX lluviosa elegida (neblina, pizarra, carbón, más un acento cálido).

En Media.io puedes iterar rápido: ajusta “colores dominantes”, intercambia el acento (amarillo vs terracota) y mantiene el mismo prompt de layout para comparar opciones una al lado de otra.

Una vez que te guste el resultado, exporta los visuales para presentaciones, moodboards o aprobaciones de clientes—y luego construye tu sistema de diseño final alrededor de la paleta ganadora.

Siguiente: Paleta de Colores Verde Borgoña