20 Combinaciones de Paletas en Tonos Grises y Blancos Modernos para Inspirarte

Una paleta de colores gris y blanco es la forma más rápida de lograr diseños limpios, modernos e intencionados. Proporciona contraste, jerarquía y espacio visual sin competir con tu contenido.

A continuación se presentan 20 combinaciones de paletas gris y blanco (con códigos HEX) que puedes utilizar para UI, branding, impresión e interiores, además de ejemplos de prompts que puedes recrear con Media.io.

Por qué funcionan tan bien las paletas gris y blanco

Las combinaciones de gris y blanco son naturalmente flexibles: pueden verse cálidas (blancos cremosos + grises topo) o frías (grises azulados + blancos nítidos), manteniéndose siempre minimalistas y legibles.

Además, crean una jerarquía confiable. Con solo unos pasos entre el blanco y el carbón, puedes separar secciones, dar profundidad a las tarjetas y guiar la atención a los botones o titulares sin añadir ruido visual.

Lo más importante: los tonos neutros convierten tu contenido en el protagonista: fotos, productos, tipografías y visualizaciones de datos suelen lucir más premium cuando la paleta no compite por llamar la atención.

Ideas de paletas de color gris y blanco (con códigos HEX)

1) Concreto escarchado

HEX: #f6f6f4 #e3e4e6 #c7c9cc #8e9096 #2f3033

Estado de ánimo: frío, cimentado, arquitectónico

Ideal para: interiores de loft industrial

Fríos y arquitectónicos, estos tonos se sienten como concreto pulido bajo la luz invernal. Funcionan maravillosamente en superficies grandes como paredes, armarios y muebles empotrados donde el contraste sutil es importante. Combina con herrajes negros mate, acero cepillado o roble cálido para evitar un ambiente estéril. Consejo: usa el carbón más oscuro en molduras o marcos para definir el espacio sin saturarlo.

Ejemplo de imagen de concreto escarchado generado con media.io

Media.io

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

Pruébalo gratis ahora

2) Lino invernal

HEX: #fbfaf7 #f0eee8 #d9d6cf #b0aea7 #4a4946

Estado de ánimo: cálido, calmado, íntimo

Ideal para: invitaciones de boda

Cálida y relajante, se percibe como tela de lino, papel de vitela y luz suave de vela. Los blancos cremosos garantizan tipografía elegante, mientras el gris más profundo aporta estructura para nombres y fechas. Mezcla con detalles dorados, toques de rubor o ilustraciones de flores prensadas para un acabado romántico. Consejo: mantén el fondo blanco roto y reserva el tono más oscuro para los títulos, asegurando claridad en impresión.

Ejemplo de imagen de lino invernal generado con media.io

3) Niebla de grafito

HEX: #ffffff #e7e8ea #bfc2c7 #6b6f77 #1f2228

Estado de ánimo: elegante, moderno, enfocado

Ideal para: UI para apps en modo oscuro

Elegante y enfocado, la gama evoca niebla deslizándose sobre grafito, con destellos nítidos que facilitan la lectura. Ideal para interfaces en modo oscuro donde la jerarquía depende de cambios sutiles más que de colores intensos. Combina con un acento eléctrico como cian o lima para estados activos y notificaciones. Consejo: para la base principal usa el casi negro, y el gris medio para las tarjetas, evitando contrastes turbios.

Ejemplo de imagen de niebla de grafito generado con media.io

4) Muros de galería

HEX: #f8f8f8 #ededed #cfcfcf #9a9a9a #2a2a2a

Estado de ánimo: limpio, curado, minimalista

Ideal para: branding para galerías de arte

Limpio y curado, evoca muros blancos, iluminación suave y espacio negativo alrededor de las obras. Esta paleta gris y blanca es ideal para marcas donde el contenido debe destacar y sentirse premium. Combina con un solo color firma para resaltar exposiciones o eventos. Consejo: mantén logotipos en carbón y fondos en grises claros para nitidez en impresiones.

Ejemplo de imagen de muros de galería generado con media.io

5) Acero y nieve

HEX: #fafbfd #dfe6ee #b9c3cf #6c7a89 #22272e

Estado de ánimo: nítido, tecnológico, ligero

Ideal para: landing pages de productos tecnológicos

Nítidos y tecnológicos, estos grises fríos recuerdan el resplandor de la nieve sobre acero cepillado. Los tonos crean profundidad en secciones y tarjetas sin bordes pesados, ideal para layouts web modernos. Combina este gris y blanco con cobalto, turquesa o CTAs verde neón para enfoque inmediato. Consejo: usa el tono más claro para la portada y el gris pizarra para la navegación, dando anclaje a la página.

Ejemplo de imagen de acero y nieve generado con media.io

6) Perla carbón

HEX: #f5f3f4 #e0dde0 #b8b2b9 #7a747d #2b262e

Estado de ánimo: suave, lujoso, sofisticado

Ideal para: empaques de belleza

Suave y lujosa, la paleta recuerda al polvo de perla y carbón ahumado frente a un tocador. Ideal para cosméticos donde el contraste sutil señaliza calidad y contención. Acompaña con lámina oro rosa, tapas negras brillantes o un acento malva apagado para un aire boutique moderno. Consejo: coloca el texto principal en el tono más oscuro y paneles secundarios en medios para mantener etiquetas legibles bajo reflejo.

Ejemplo de imagen de perla carbón generado con media.io

7) Puerto brumoso

HEX: #f2f5f4 #d6dcda #aeb8b5 #6a7774 #2d3534

Estado de ánimo: brumoso, costero, relajado

Ideal para: lobbies de hoteles costeros

Brumoso y relajado, recuerda la niebla marina, la madera a la deriva y la pizarra junto al mar. Los matices gris verdosos evitan que los neutros se perciban planos, sobre todo en espacios públicos abiertos. Combina con beige arena, madera desgastada y latón cálido para un ambiente acogedor. Consejo: utiliza el tono más oscuro en señalización para mantener la legibilidad sobre muros pálidos.

Ejemplo de imagen de puerto brumoso generado con media.io

8) Estudio monocromático

HEX: #fcfcfc #f1f1f1 #d5d5d5 #7d7d7d #1a1a1a

Estado de ánimo: definido, editorial, atemporal

Ideal para: sitios web de portafolio

Definido y atemporal, evoca un estudio brillante con banderas negras y fondos limpios de papel. Los extremos fuertes destacan tipografía e imágenes de forma intencionada, aún con estilo minimalista. Combina con un solo color acento para estados hover y etiquetas de proyectos, pero mantenlo sutil. Consejo: usa textos en gris profundo en vez de negro puro para evitar reflejos en zonas blancas.

Ejemplo de imagen de estudio monocromático generado con media.io

9) Pizarra suave

HEX: #f7f8fa #e1e4ea #c2c7d0 #7b8391 #343a44

Estado de ánimo: profesional, calmado, confiable

Ideal para: reportes corporativos

Profesional y calmada, estos grises azulados evocan diapositivas pulidas, tablas ordenadas y datos confiables. Excelentes para informes donde los gráficos necesitan separación sin líneas duras. Combina con un acento sutil como azul marino o esmeralda para métricas clave y destacados. Consejo: usa el tono más claro para fondos y reserva la pizarra para encabezados, facilitando la lectura en documentos largos.

Ejemplo de imagen de pizarra suave generada usando media.io

10) Libro Mayor de Mármol

HEX: #f9f9f9 #e8e7e5 #c9c6c0 #9a968f #3a3936

Estado de ánimo: elegante, silencioso, refinado

Ideal para: diseño de baño de lujo

Elegante y silencioso, recuerda las vetas del mármol, losetas de piedra caliza y la suave iluminación de hotel. Los grises cálidos mantienen el espacio con una sensación de spa en vez de clínico. Combina con acabados metálicos champán, toallas cremosas y madera clara para un aspecto de lujo relajado. Consejo de uso: repite el gris intermedio en el detalle del grout o piedra para que el ambiente se sienta cohesivo.

Ejemplo de imagen de libro mayor de mármol generada usando media.io

11) Oficina Nube

HEX: #ffffff #f2f4f7 #d6dbe3 #9aa3b2 #2e3440

Estado de ánimo: clara, aireada, productiva

Ideal para: dashboards SaaS

Clara y aireada, se siente como luz diurna a través de grandes ventanas en una oficina tranquila. Esta combinación de colores gris-blanco está diseñada para dashboards que necesitan superficies calmas y jerarquía inconfundible. Combina con un solo color de marca para botones principales y utiliza matices sutiles para estados y alertas. Consejo de uso: mantén las líneas de cuadrícula extremadamente suaves y usa el gris medio para estructurar.

Ejemplo de imagen de oficina nube generada usando media.io

12) Loft Silencioso

HEX: #f4f4f2 #deddd9 #b9b6af #86827a #3c3a35

Estado de ánimo: acogedor, moderno, habitado

Ideal para: escenografía de apartamento moderno

Acogedor y habitado, estos neutros cálidos evocan mantas de lana, papel natural y sombras suaves. Son ideales para escenografía porque favorecen pisos de madera y hacen que los espacios se fotografíen bien. Combina con cerámicas terracota, plantas de olivo y textiles con textura para aportar calidez. Consejo de uso: utiliza el tono más oscuro de manera limitada en marcos y luminarias para mantener el ambiente brillante.

Ejemplo de imagen de loft silencioso generada usando media.io

13) Snowcap Branding

HEX: #ffffff #f5f5f5 #dadada #a3a3a3 #2c2c2c

Estado de ánimo: limpio, confiado, versátil

Ideal para: logotipos de startups y presentaciones

Limpio y confiado, parece papel fresco con tinta nítida y tipografía moderna. El contraste es lo suficientemente fuerte para logotipos, íconos y gráficos sin ser demasiado duro. Esta combinación gris-blanco queda bien con un acento audaz de marca como cobalto, coral o lima. Consejo de uso: mantén las diapositivas mayormente claras y usa el tono carbón sólo para títulos y números clave.

Ejemplo de imagen de snowcap branding generada usando media.io

14) Minimal Ceniza

HEX: #f8f7f6 #e2e0de #c6c2bf #8f8a86 #3b3836

Estado de ánimo: simple, suave, discreto

Ideal para: fondos para fotografía de productos

Simple y discreto, recuerda el yeso suave, ceniza y luz de estudio difusa. Estos tonos hacen que los productos destaquen sin contraste agresivo ni matices. Combina con un material táctil como papel kraft, lino o cerámica para dar profundidad en las tomas. Consejo de uso: usa el gris medio como superficie y mantén el tono más claro para fondos continuos.

Ejemplo de imagen de minimal ceniza generada usando media.io

15) Abedul Plateado

HEX: #f6f7f5 #e0e4dd #c0c7bf #879186 #2f352f

Estado de ánimo: fresco, natural, equilibrado

Ideal para: etiquetas para cuidado ecológico de la piel

Fresco y natural, sugiere corteza de abedul, hojas de salvia y luz matinal. El matiz verde-gris añade sensación orgánica, perfecta para marcas de belleza y bienestar. Combina con texturas de papel reciclado y un acento botánico apagado como eucalipto o arcilla. Consejo de uso: mantén los bloques de ingredientes sobre el fondo más claro y usa el tono profundo para texto regulatorio para garantizar legibilidad.

Ejemplo de imagen de abedul plateado generada usando media.io

16) Noche Polar

HEX: #fdfdfd #d9dde1 #a7adb5 #515a66 #0f141b

Estado de ánimo: dramático, cinematográfico, alto contraste

Ideal para: carteles cinematográficos

Dramático y cinematográfico, evoca nieve bajo la luz de la luna y un horizonte muy oscuro. El rango de contraste soporta tipografía audaz, degradados intensos y siluetas fuertes. Combina con un solo acento saturado como rojo intenso o azul eléctrico. Consejo de uso: emplea grises medios para textura de fondo y así el texto negro y elementos focales quedan nítidos.

Ejemplo de imagen de noche polar generada usando media.io

17) Concrete Chic

HEX: #f3f3f3 #d8d8d8 #b2b2b2 #707070 #252525

Estado de ánimo: urbano, moderno, estiloso

Ideal para: menús para restaurantes

Urbano y moderno, evoca encimeras de hormigón, metal cepillado y un comedor con poca luz. Esta paleta gris-blanco es ideal para menús porque mantiene la composición limpia y resalta precios y encabezados. Combina con un toque de color para platos especiales, como rojo intenso o verde hierba. Consejo de uso: evita usar el tono más claro para texto pequeño y usa el gris medio para letra fina para mayor legibilidad.

Ejemplo de imagen de concrete chic generada usando media.io

18) Misted Type

HEX: #fafafa #e6e8eb #c8ccd3 #818896 #303643

Estado de ánimo: reflexivo, literario, moderno

Ideal para: portadas de libros

Reflexivo y literario, alude a niebla suave, papel en capas y librerías tranquilas. Los tonos fríos ayudan a que los títulos destaquen sin usar colores estridentes, especialmente en ficción contemporánea y no ficción. Combina con un elemento de textura como grano, acuarela o una sutil superposición fotográfica. Consejo de uso: manten el nombre del autor en tono más oscuro y el título en gris pizarra para una jerarquía refinada.

Ejemplo de imagen de misted type generada usando media.io

19) Cocina Nórdica

HEX: #fcfbf9 #ecebe7 #d1cec7 #9c978d #3f3c36

Estado de ánimo: brillante, hogareña, escandinava

Ideal para: cocinas escandinavas

Brillante y hogareña, evoca luz matinal sobre gabinetes pintados y encimeras de piedra clara. Los grises cálidos previenen que los blancos se vean fríos, ideal para cocinas con superficies reflectantes. Combina con madera de fresno claro, accesorios negros mate y plantas verdes suaves. Consejo de uso: utiliza el gris profundo en la isla o gabinetes bajos para dar estabilidad visual.

Ejemplo de imagen de cocina nórdica generada usando media.io

20) Papelería tormentosa

HEX: #f7f7f9 #e2e3e8 #bfc3cc #6d7380 #242832

Estado de ánimo: pulida, moderna, ligeramente melancólica

Ideal para: sets de papelería minimalista

Pulida con un toque de melancolía, evoca tardes lluviosas, papel suave y líneas de tinta limpias. Los grises fríos hacen que cartas, sobres y tarjetas se sientan profesionales sin ser rígidos. Combina con un solo color como azul marino, verde bosque o burdeos apagado para sellos y detalles. Consejo de uso: imprime áreas grandes en tonos claros y utiliza el oscuro para monogramas y datos de contacto.

Ejemplo de imagen de papelería tormentosa generada usando media.io

¿Qué colores combinan bien con gris y blanco?

El gris y blanco combinan bien con casi cualquier color acento porque son neutros y predecibles. Para un estilo de UI moderno, prueba acentos vivos como cobalto, cian, lima o coral para que los CTA y estados activos sean inmediatamente visibles.

Si buscas calidez, añade beige arenoso, caramelo, terracota o blush suave; estos transforman un diseño monocromático en algo más acogedor sin perder el aspecto minimalista.

Para marcas premium o editoriales, los metálicos (oro/rosa dorado) y tonos profundos (azul marino, verde bosque, burdeos) añaden riqueza manteniendo controlada la paleta general.

Cómo utilizar una paleta gris y blanca en diseños reales

Empieza con una función para cada tono: el más claro para fondos, claro-medio para superficies (tarjetas/secciones), medio para bordes y divisores, oscuro-medio para texto secundario y carbón para títulos y números clave.

Cuida el contraste—especialmente sobre blanco. Para lecturas largas, el texto gris profundo suele ser más cómodo que negro puro, y los grises muy claros deben reservarse para áreas grandes, no para texto pequeño.

Para evitar un efecto plano, incorpora textura: grano sutil, sombras suaves, detalles de papel/lino o un solo acento saturado para momentos interactivos.

Crea visuales de paleta gris y blanca con IA

Si tienes que presentar una dirección de marca o crear un moodboard de UI, las imágenes importan tanto como los códigos HEX. Convertir una paleta gris-blanco en escenas realistas (interiores, packaging, carteles, landing pages) acelera la toma de decisiones.

Con la herramienta de texto a imagen de Media.io, puedes pegar un prompt, iterar estilos y generar ejemplos consistentes para presentaciones, revisiones de clientes o planeación de contenido.

Usa los prompts anteriores como punto de partida y luego cambia a tu industria (por ejemplo, “dashboard fintech” o “etiqueta cuidado de piel”) y tu preferencia de relación de aspecto.

Siguiente: Paleta de colores negro