20 Mejores Paletas de Colores Grises con Códigos Hexadecimal

Las paletas de colores grises son la opción preferida cuando se busca que los diseños transmitan calma, modernidad y facilidad de lectura. Desde fondos suaves y brumosos hasta contrastes dramáticos de carbón, el gris funciona en interfaces, interiores y branding.

A continuación, te presentamos 20 ideas seleccionadas de esquemas de colores grises con códigos HEX, notas de ambiente, mejores usos y ejemplos visuales generados por IA que puedes recrear en minutos.

Por qué las paletas de grises funcionan tan bien

El gris es un neutro que favorece de forma natural la claridad visual. Reduce el ruido, permite que la tipografía y la estructura del diseño se destaquen y facilita establecer jerarquía con apenas unos cuantos tonos del claro al oscuro.

Como el gris puede ser cálido (topo, guijarro, espresso) o frío (pizarra, acero, plata azulada), se adapta a casi cualquier personalidad de marca. Puedes mantenerlo sobrio y minimalista o llevarlo a lo cinematográfico con grises profundos casi negros.

El gris también combina fácilmente con colores de acento. Un solo toque de verde azulado, cobre, rubor u oliva puede convertirse en tu sello mientras los neutros mantienen el sistema coherente.

Más de 20 ideas de paletas grises (con códigos HEX)

1) Hormigón Brumoso

HEX: #F2F4F6 #D9DEE3 #B6BEC8 #7B8794 #2F3640

Ambiente: aireado, moderno, sereno

Ideal para: paneles de control minimalistas y sitios web SaaS

Los neutros aireados y brumosos evocan concreto pulido, luz suave y espacios de trabajo ordenados. Estos tonos funcionan de maravilla en paneles donde la legibilidad importa y el ruido visual debe mantenerse bajo. Combina el gris pizarra oscuro con divisores finos y deja que el casi blanco sea el protagonista de diseños espaciosos. Consejo de uso: reserva el tono más oscuro para títulos e íconos clave para mantener un contraste nítido sin resultar agresivo.

Ejemplo de imagen de hormigón brumoso generado con media.io

Media.io

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

Pruébalo gratis ahora

2) Grafito Denim

HEX: #E7EAEE #C6CBD3 #8B94A3 #3C4658 #1E2430

Ambiente: elegante, tecnológico, confiado

Ideal para: interfaces de apps, branding fintech, presentaciones

Los tonos de grafito elegantes con un matiz azul denim se sienten inteligentes, estructurados y discretamente seguros. Los grises medios son lo suficientemente fuertes para gráficos y tablas, mientras que los más oscuros dan a los títulos un toque premium. Combina con íconos de línea simples y espacios generosos en blanco para dar una sensación de producto moderno. Consejo de uso: mantén los fondos en los dos tonos más claros para evitar una pantalla pesada o muy cargada.

Ejemplo de imagen de grafito denim generado con media.io

3) Guijarro Cálido

HEX: #FAF7F3 #E2D7CF #B8AAA0 #7E6F66 #3B3531

Ambiente: acogedor, orgánico, cercano

Ideal para: salones, cafeterías, marcas de estilo de vida

Los neutros guijarro acogedores evocan piedras de río, mantas de lana y barro calentado por el sol. Los matices cálidos hacen que los espacios sean acogedores, especialmente en interiores con mucha madera. Combina con texturas naturales como lino, roble y cerámica mate para mantenerlo táctil. Consejo de uso: usa el gris-marrón más profundo con moderación como acento en marcos o herrajes para que la paleta permanezca suave.

Ejemplo de imagen de guijarro cálido generado con media.io

4) Pantalla Plateada

HEX: #FFFFFF #E5E7EB #C7CCD4 #9AA3AF #111827

Ambiente: limpio, editorial, alto contraste

Ideal para: maquetas de revistas, portafolios, sitios liderados por tipografía

Los neutros grises plateados y limpios con contraste de tinta evocan papel fresco y tipografías negras definidas. Este esquema de grises es ideal cuando quieres que la fotografía y los titulares hablen por sí solos. Combínalo con tipografías sans-serif audaces y márgenes amplios para un ritmo editorial premium. Consejo de uso: mantén el texto principal en el casi negro y reserva los grises medios para leyendas y etiquetas de interfaz.

Ejemplo de imagen de pantalla plateada generado con media.io

5) Carbón Espresso

HEX: #F4F1EE #D7D0C8 #A79B90 #4A3F39 #1F1B18

Ambiente: rico, íntimo, sofisticado

Ideal para: empaque de café, menús boutique, etiquetas premium

Los neutros carbón-marrón evocan crema de espresso, cuero y noches a la luz de las velas. El contraste se siente lujoso sin caer en el blanco y negro estricto. Combina con papel blanquecino y estampado sutil para darle un aspecto premium y táctil. Consejo de uso: deja que el tono superior cremoso predomine y los oscuros actúen solo como acentos, no como fondo pesado.

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

6) Niebla Urbana

HEX: #F6F7F8 #E1E4E8 #B4BBC5 #6A7484 #2A2F38

Ambiente: melancólico, metropolitano, discreto

Ideal para: portafolios de arquitectura y presentaciones corporativas

Los grises urbanos y melancólicos evocan paisajes llenos de niebla, vigas de acero y aceras lluviosas. Los tonos medios estructuran los diseños y el carbón profundo ancla títulos y destacados. Combina con fotografía monocromática y líneas de cuadrícula finas para enfatizar la forma y el espacio. Consejo de uso: usa el tono medio azul-gris para botones secundarios y así destacar acciones sin exagerar.

Ejemplo de imagen de niebla urbana generado con media.io

7) Lila Escarchada

HEX: #F7F5FA #DED7E8 #B7AACB #6F6488 #2E2A3B

Ambiente: suave, soñador, romántico moderno

Ideal para: branding de belleza, publicaciones wellness, temas UI suaves

Los grises con matiz lila suave recuerdan vidrio esmerilado, niebla de lavanda y momentos de autocuidado en calma. El matiz violeta aporta personalidad manteniéndose lo suficientemente sutil para espacios limpios. Combina con arte de línea minimalista y mucho espacio en blanco para mantener todo aireado. Consejo de uso: utiliza el gris ciruela profundo solo en pequeños acentos como íconos y divisores, nunca como fondo completo.

Ejemplo de imagen de lila escarchada generado con media.io

8) Hormigón y Cobre

HEX: #F3F4F5 #D0D4D9 #8A9099 #3E434A #B87333

Ambiente: industrial, cálido, de diseño

Ideal para: anuncios de productos, marcas de hardware, cocinas modernas

Tonos de hormigón industrial con un toque de cobre recuerdan luces de loft y detalles de metal cepillado. Estas combinaciones brillan en anuncios de productos donde se necesita una base neutra y un acento seguro. Combina el cobre con el carbón más oscuro para un contraste premium y mantiene el fondo en los dos grises más claros. Consejo de uso: usa el cobre solo en un elemento focal por diseño, como un botón o insignia, para evitar la sobrecarga visual.

Ejemplo de imagen de hormigón y cobre generado con media.io

9) Pizarra y Espuma de Mar

HEX: #F2F5F6 #CAD2D7 #8A9AA5 #2F3C46 #7FB7B3

Ambiente: fresco, costero, equilibrado

Ideal para: apps de salud, folletos de spa, branding de viajes

Los grises pizarra frescos con un acento espuma de mar evocan aire costero y espacios wellness modernos y limpios. El matiz verde azulado aporta energía mientras los neutros mantienen todo legible y tranquilo. Combina con componentes UI redondeados o carteles aireados para un ambiente amigable y contemporáneo. Consejo de uso: deja que la espuma de mar se reserve como el color de acción principal para enlaces y botones principales.

Ejemplo de imagen de pizarra y azul verdoso generado usando media.io

10) Mono Minimalista

HEX: #FAFAFA #E0E0E0 #B0B0B0 #707070 #101010

Ambiente: minimalista, atemporal, nítido

Ideal para: logos, carteles tipográficos, acentos de modo oscuro en UI

El monocromo minimalista se percibe como paredes de galería, impresión nítida y tipografía perfectamente alineada. Los pasos entre tonos son limpios, facilitando la jerarquía tanto en entornos digitales como impresos. Combina con una sola familia de fuentes geométricas y espaciado constante para un sistema refinado y moderno. Consejo de uso: reserva el tono más oscuro solo para anclajes clave, así el diseño permanece ligero y aireado.

Ejemplo de imagen de mono minimalista generado usando media.io

11) Puerto Tormentoso

HEX: #F0F3F5 #C5CFD8 #7C8A96 #2D3A45 #0B1218

Ambiente: dramático, náutico, serio

Ideal para: portadas de documentos, presentaciones de consultoría, banners hero

Los grises náuticos evocan aguas profundas, nubes densas y barcos al anochecer. La gama fría transmite profesionalidad y estabilidad, ideal para contenido que necesita autoridad. Combínalo con iconografía simple y tipografía robusta alineada a la izquierda para reforzar la claridad. Consejo de uso: utiliza el casi negro para títulos y mantén las zonas extensas en tonos claros para evitar un muro lúgubre.

Ejemplo de imagen de puerto tormentoso generado usando media.io

12) Ceniza Rosa Empolvada

HEX: #F7F2F3 #E1D4D6 #B5A0A4 #6C545A #2A2023

Ambiente: suave, vintage, íntimo

Ideal para: invitaciones de boda, etiquetas de velas, publicaciones de estilo de vida

La ceniza rosa suave recuerda pétalos secos, telas en tonos rubor y papelería vintage. Estas combinaciones de grises son perfectas cuando buscas romanticismo sin ser dulce ni brillante. Combina con tipografía serif y textura de papel sutil para un acabado artesanal y elegante. Consejo de uso: reserva el gris vino más oscuro para pequeños detalles como monogramas, bordes o texto de pie de página.

Ejemplo de imagen de ceniza rosa empolvada generado usando media.io

13) Sombra Oliva

HEX: #F4F5F2 #D5D7CF #9AA091 #4C5346 #1E241B

Ambiente: terrenal, apagado, natural

Ideal para: marcas de exterior, empaques ecológicos, blogs de naturaleza

Los grises con matiz oliva evocan sombras de bosque, piedras musgosas y lienzo desgastado. La paleta se siente sólida y sostenible, ideal para marcas ecológicas. Combina con texturas kraft, papel reciclado y gráficos simples estilo sello para una apariencia auténtica. Consejo de uso: utiliza el verde-gris casi negro para tipografía, así los tonos claros permanecen suaves y naturales.

Ejemplo de imagen de sombra oliva generado usando media.io

14) Gris Arenisca

HEX: #FBF8F2 #E5DDCF #C2B7A6 #8A7D6D #3E352E

Ambiente: iluminado por el sol, natural, relajado

Ideal para: interiores, branding para hoteles, folletos de viajes

Los neutros de arenisca iluminados por el sol recuerdan senderos desérticos, sombras suaves y paredes cálidas de yeso. Los reflejos cremosos mantienen el ambiente brillante mientras los tonos taupe agregan profundidad y estructura. Combina con fotografía natural, texturas de ratán y luz cálida para un ambiente tranquilo y sofisticado. Consejo de uso: utiliza el tono medio como fondo principal de UI o impresión para reducir el resplandor sin perder luminosidad.

Ejemplo de imagen de gris arenisca generado usando media.io

15) Noir Neón

HEX: #F1F2F4 #B8BDC7 #5F6675 #1A1D25 #00A6A6

Ambiente: vida nocturna, audaz, cinematográfico

Ideal para: carteles musicales, lanzamientos tecnológicos, branding para streamers

Los grises oscuros cinematográficos con acento de azul neón evocan noches urbanas, señalización brillante y energía nocturna. La paleta ofrece contraste dramático sin depender siempre del negro puro. Combina con tipografía grande y formas geométricas simples para mantener el acento neón intencional. Consejo de uso: reserva el azul neón para un único elemento destacado como fecha, llamada a la acción o subrayado.

Ejemplo de imagen de noir neón generado usando media.io

16) Prensa Vintage

HEX: #FDF9F0 #E7E0D5 #B9B0A4 #6A6258 #2E2A25

Ambiente: tradicional, acogedor, editorial

Ideal para: portadas de libros, diarios, menús de café

Los neutros tradicionales recuerdan papel envejecido, lavados de tinta y páginas bien leídas. Los grises cálidos suavizan el contraste, haciendo que la tipografía extensa se sienta cómoda y clásica. Combina con fuentes serif, reglas sutiles y fondos blanco roto para un tono editorial atemporal. Consejo de uso: agrega textura ligeramente y mantén espaciado generoso para que se lea vintage, no saturado.

Ejemplo de imagen de prensa vintage generado usando media.io

17) Granito Alpino

HEX: #EFF2F1 #C6CFCC #8B9A95 #45524E #1E2623

Ambiente: fresco, natural, refinado

Ideal para: marcas de senderismo, ropa para exteriores, empaques minimalistas

Los grises de granito sugieren mañanas alpinas, caminos de piedra y aire de bosque perenne. Los neutros con matiz verde se sienten frescos sin volverse totalmente coloridos. Combina con tipografía sans-serif limpia e ilustraciones lineales simples para una apariencia outdoor moderna. Consejo de uso: mantén los fondos pálidos y usa el tono más oscuro para insignias, marcas de talla y etiquetas clave.

Ejemplo de imagen de granito alpino generado usando media.io

18) Plata Cibernética

HEX: #F7FAFC #D6DEE8 #A1AFBF #4A5B70 #0F172A

Ambiente: futurista, nítido, profesional

Ideal para: páginas B2B, herramientas de datos, presentaciones de ventas

Los tonos azul-plata nítidos se perciben futuristas, como aluminio pulido e interfaces limpias. La gama proporciona profundidad natural para tarjetas, navegación y secciones de datos. Combina con degradados sutiles y contornos finos para enfatizar estructura y jerarquía. Consejo de uso: utiliza el tono medio de acero para estados UI inactivos y reserva el más oscuro para destacar acciones clave.

Ejemplo de imagen de plata cibernética generado usando media.io

19) Mármol de Chocolate

HEX: #F6F2EC #D8CDBF #A28F7A #5A4635 #241B14

Ambiente: lujo, cálido, artesanal

Ideal para: empaque de chocolate, anuncios gourmet, branding boutique

Los neutros cálidos que recuerdan mármol evocan polvo de cacao, encimeras de piedra y artesanía exclusiva. El gradiente de crema a chocolate profundo resulta indulgente y premium en impresión. Combina con acentos dorados o estampado simple en foil para un acabado de alta gama. Consejo de uso: reserva el marrón más profundo para tipografía pequeña y logos, así el diseño sigue rico sin sobrecargar.

Ejemplo de imagen de mármol de chocolate generado usando media.io

20) Hormigón de Medianoche

HEX: #E9EDF2 #B9C1CC #6B7482 #2A2F37 #0B0D10

Ambiente: audaz, arquitectónico, dramático

Ideal para: branding de estudio, series de carteles, temas UI oscuros

Los grises de medianoche transmiten hormigón al anochecer, siluetas nítidas y arquitectura moderna. Esta paleta de grises es perfecta para lograr drama sin perder neutralidad y flexibilidad en el diseño. Combina con tipografía grande y formas mínimas para carteles impactantes o secciones hero. Consejo de uso: utiliza el tono más claro para dejar espacio alrededor del texto y evitar sensación de fondo oscuro apretado.

Ejemplo de imagen de hormigón de medianoche generado usando media.io

¿Qué colores combinan bien con el gris?

El gris combina bien tanto con acentos cálidos como fríos porque no compite por la atención. Para un look limpio y moderno, prueba azul verdoso, pizarra, cobalto o azul helado contra grises pizarra y plata.

Si buscas calidez y comodidad, elige cobre, terracota, rubor, camel o crema—especialmente con grises piedra, taupe o espresso. Estas combinaciones resultan acogedoras y a la vez neutrales.

Para un contraste de alto impacto, usa carbón casi negro con blanco brillante y añade un color de acento (como azul neón) para botones, insignias o detalles destacados.

Cómo usar una paleta gris en diseños reales

Comienza asignando roles a cada gris: el más claro para fondos, tonos medios para tarjetas y bordes, el más oscuro para encabezados y texto principal. Así las interfaces son legibles y consistentes entre páginas.

En interiores y branding, el gris funciona mejor al añadir textura: cerámica mate, lino, metal cepillado, textura de papel o hormigón. La textura previene que los esquemas neutrales resulten planos o excesivamente “fríos”.

Limita tu color de acento de manera intencional. Un solo acento (cobre, azul verdoso, lila o azul pizarra) aplicado consistentemente en CTAs y detalles clave crea un sistema pulido sin saturar visualmente.

Crea visuales de paletas grises con IA

Si tienes códigos HEX y necesitas mockups rápido, puedes generar visuales a juego con IA—composiciones de carteles, landing pages, conceptos de empaque y más—sin empezar desde cero.

Usa el nombre de tu paleta y palabras clave de estado de ánimo (como “niebla urbana” o “piedra cálida”), especifica el tipo de diseño (dashboard, invitación, folleto) para resultados más precisos. Mantén los prompts claros y menciona tu color de acento si tienes uno.

Una vez que te guste un resultado, itera ajustando luz, textura y composición, manteniendo los mismos cinco colores base para coherencia.

Siguiente: Paleta de colores verde durazno