20 Paletas de Colores Oscuros: Combinaciones, Códigos Hex y Ejemplos con IA

Las paletas de colores oscuros hacen que los diseños se sientan intencionales: tipografía enfocada, contraste controlado y un ambiente premium de “horas nocturnas” que funciona en interfaces, branding e impresión.

A continuación encontrarás más de 20 ideas de paletas oscuras con códigos HEX, además de consejos prácticos para combinar y prompts de IA que puedes reutilizar para generar imágenes a juego rápidamente.

Por qué funcionan tan bien las paletas oscuras

Las paletas oscuras crean jerarquía al instante: tu tono más brillante se convierte en un foco para estados clave de UI, titulares y números, mientras que los tonos profundos mantienen todo lo demás calmado y organizado.

También hacen que los colores luzcan más ricos. Los acentos joya, metales cálidos y pastel suaves suelen sentirse más premium sobre fondos carbón, tinta o medianoche que sobre blanco.

Por último, los esquemas oscuros son prácticos para pantallas modernas. Si equilibras bien el contraste (y evitas el negro puro en todas partes), las interfaces oscuras resultan cómodas para sesiones largas y reducen el deslumbramiento en ambientes de poca luz.

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

1) Tinta medianoche

HEX: #0b0f1a #111a2e #1b2a41 #2f3e56 #c8d3e0

Ambiente: tranquilo, nítido, editorial

Ideal para: UI de apps de noticias y tableros de análisis

Azules medianoche suaves y grises entintados evocan un resplandor tranquilo de sala de control. El matiz azul grisáceo claro mantiene la legibilidad sin romper el ambiente. Úsala para tableros, tablas de datos y layouts con mucha navegación donde el contraste es clave. Combínala con iconos de línea delgados y un único acento cálido como cobre apagado para alertas. Consejo: reserva el tono más claro para los números clave y así guiar la vista.

Ejemplo de imagen de tinta medianoche generado usando media.io

Media.io

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

Pruébalo ahora gratis

2) Verde obsidiana

HEX: #071014 #0a1f24 #0f3a3f #1c6b6a #b8f2e6

Ambiente: elegante, acuático, tecnológico

Ideal para: páginas SaaS y secciones de funcionalidades

Tonos obsidiana y verde marino profundo evocan luz moviéndose bajo el agua. El matiz menta brillante es perfecto para llamadas a la acción y microinteracciones sin llegar a ser neón. Úsala en landing pages con mucho espacio y degradados sutiles. Combina con tipografía geométrica sans serif y elevaciones de sombra suave para un look moderno. Consejo: limita los acentos verde a menos del 10% para mantener la página premium.

Ejemplo de imagen de verde obsidiana generado usando media.io

3) Ciruela noir

HEX: #0e0b12 #211428 #3a1c42 #6a2c6b #f2d7f7

Ambiente: dramática, aterciopelada, lujosa

Ideal para: branding de belleza y anuncios de fragancias

Morados aterciopelados sobre casi negro crean un glamour suntuoso y nocturno. El matiz rubor-lila suave aporta un resplandor tipo skincare para destacar productos. Úsala en branding de belleza, etiquetas premium y creativos sociales cinematográficos. Combina con titulares serif y mucho espacio en blanco para un aire boutique. Consejo: añade una textura de grano sutil para evitar degradados planos en zonas oscuras.

Ejemplo de imagen de ciruela noir generado usando media.io

4) Puerto tormentoso

HEX: #0d1416 #1b2a2f #2e454e #4f7b86 #d7eef2

Ambiente: costero, sólido, maduro

Ideal para: webs y catálogos de equipamiento outdoor

Pizarras tormentosas y verdes puerto dan una sensación robusta, como muelles curtidos y sal marina. El matiz helado mantiene los layouts aireados pero suaves. Úsala para marcas outdoor, catálogos de productos y mensajes de sostenibilidad. Combina con neutros cálidos como arena o beige en fotografía para suavizar la frialdad. Consejo: usa el color más claro como banda de fondo para separar secciones claramente.

Ejemplo de imagen de puerto tormentoso generado usando media.io

5) Humo de brasas

HEX: #120c0a #2a1712 #4a2618 #a14b2c #f3cfb7

Ambiente: cálido, rústico, cinematográfico

Ideal para: empaques de café y etiquetas de alimentos artesanales

Café ahumado y marrones brasas recuerdan a granos tostados y luz de fuego. El crema durazno suave funciona como base de etiqueta clara y legible. Úsala para bolsas de café, salsas BBQ y packaging artesanal. Combina con texturas kraft e iconografía simple para mantener la honestidad y el enfoque artesanal. Consejo: un barniz selectivo en el tono brasa añade atractivo inmediato en el estante.

Ejemplo de imagen de humo de brasas generado usando media.io

6) Uva galáctica

HEX: #07070f #1a1030 #331a58 #7b3ff2 #e9ddff

Ambiente: futurista, eléctrica, divertida

Ideal para: carteles de eventos musicales y promociones nocturnas

Destellos uva eléctrica sobre negro espacial se sienten como neón en un callejón de noche. Estas combinaciones oscuras brillan en carteles donde se necesita energía y legibilidad instantánea desde lejos. Usa el violeta como héroe y el lavanda claro para fechas y detalles del lugar. Combina con tipografía condensada en negrita y figuras geométricas simples para un look de club. Consejo: mantén los degradados sutiles para que el morado luzca nítido en impresión.

Ejemplo de imagen de uva galáctica generado usando media.io

7) Oliva hierro

HEX: #0f120d #242a18 #3b4523 #6b7c3a #e6edd2

Ambiente: terroso, táctico, discreto

Ideal para: branding de workwear y diseño web utilitario

Verdes hierro y sombras oliva son prácticos, como chaquetas de lona y equipo de campo. El caqui claro resalta la tipografía y facilita leer detalles. Úsala para marcas de ropa laboral, catálogos de herramientas o ecommerce robustos. Combina con fondos fotográficos blanco roto para evitar que la página se vea demasiado pesada. Consejo: usa el oliva medio para botones secundarios y mantener la jerarquía clara.

Ejemplo de imagen de oliva hierro generado usando media.io

8) Zafiro terciopelo

HEX: #050a12 #0c1830 #132a52 #1f55a5 #d9ecff

Ambiente: limpio, seguro, corporativo

Ideal para: apps fintech y presentaciones para inversores

Azules zafiro sobre casi negro transmiten confianza y fiabilidad, como un traje hecho a medida. El matiz celeste da espacio a gráficos y KPIs. Úsala en productos fintech, pitch decks y interfaces con altas exigencias de claridad. Combina con divisores sutiles y un único acento como lima suave para estados de éxito. Consejo: reserva el azul más brillante solo para enlaces y acciones principales.

Ejemplo de imagen de zafiro terciopelo generado usando media.io

9) Rosa ceniza

HEX: #120b0e #2a141e #4a1f34 #a33b6a #f6d2e2

Ambiente: romántico, ahumado, moderno

Ideal para: invitaciones de boda y galas nocturnas

La mezcla de bayas ahumadas y negro ceniza evoca la luz de las velas sobre pétalos de terciopelo. El resaltado rosado mantiene el texto legible para nombres, fechas y detalles de confirmación de asistencia. Úsalo para papelería de bodas nocturnas, invitaciones de gala y relatos sociales elegantes. Combínalo con efectos de foil metálico o un dorado suave para obtener sofisticación instantánea. Consejo: imprime en papel sin recubrimiento para suavizar el contraste y crear una sensación táctil.

Ejemplo de imagen de "cinder rose" generado con media.io

10) Noche Profunda del Bosque

HEX: #060b07 #132016 #1f3725 #2f6b44 #d6f2dc

Ambiente: natural, calmado, restaurativo

Ideal para: marcas de bienestar y páginas de productos ecológicos

Los verdes sombra de pino evocan un sendero silencioso del bosque tras la lluvia. El tono menta aporta frescura en distintivos y beneficios clave. Úsalo en sitios de bienestar, páginas de productos ecológicos y cajas de suscripción que buscan transmitir una sensación de conexión con la tierra. Combínalo con neutros cálidos como avena o arcilla en la fotografía para lograr equilibrio. Consejo: aplica el verde más claro en tarjetas de contenido para facilitar la lectura en textos extensos.

Ejemplo de imagen de noche profunda del bosque generado con media.io

11) Cobre Sombreado

HEX: #0d0b0a #241a16 #3b2a22 #a86a4a #f2e0d4

Ambiente: industrial, cálido, premium

Ideal para: empaques de productos y branding de hardware

Neutros carbonizados con calidez cobriza evocan metal forjado y luz de taller. El beige suave crea espacio para especificaciones y letra pequeña. Úsalo para marcas de hardware, empaques premium y páginas de producto minimalistas. Combínalo con fotografía de materiales en macro y etiquetas sans-serif limpias para una apariencia ingenieril. Consejo: el cobre funciona mejor como franja o sello de acento, no como fondo completo.

Ejemplo de imagen de cobre sombreado generado con media.io

12) Pizarra Lunar

HEX: #0b0d10 #171c22 #2a333d #5d6f82 #e7eef5

Ambiente: minimalista, frío, técnico

Ideal para: sitios de documentación y herramientas para desarrolladores

Las pizarras frías y los grises lunares transmiten precisión, como una ventana de terminal bajo la luz de luna. El blanco brumoso facilita la lectura de fragmentos de código y tablas. Úsalo en documentación, bases de conocimiento y UIs de herramientas que requieren comodidad en sesiones largas. Combínalo con un solo acento como cian para enlaces y estados seleccionados. Consejo: coloca el texto principal sobre los bloques de fondo más claros para reducir la fatiga visual.

Ejemplo de imagen de pizarra lunar generado con media.io

13) Mora de Cuervo

HEX: #0a0710 #1a1022 #2f173a #5a2c66 #f0d9ff

Ambiente: misterioso, artístico, refinado

Ideal para: portadas de libros y carteles literarios

El negro cuervo y los violetas de mora sugieren novelas de misterio y lecturas nocturnas. Una paleta oscura como esta destaca cuando deseas dramatismo sin un contraste duro. Úsalo en portadas de libros, carteles de poesía y promociones culturales. Combínalo con efectos de papel texturizado y una serif contenida para mantener lo literario. Consejo: usa lavanda pálido para el título y deja que los violetas más profundos enmarquen el texto complementario.

Ejemplo de imagen de mora de cuervo generado con media.io

14) Neón Crepúsculo

HEX: #0b0b12 #1f1633 #2d2a6d #ff3ea5 #d7f7ff

Ambiente: audaz, juvenil, enérgico

Ideal para: overlays para gaming y paneles de streamers

Índigos profundos con un toque magenta neón evocan el perfil de una ciudad al anochecer. El tinte helado mantiene etiquetas y texto de UI nítidos en espacios compactos. Úsalo en overlays de streaming, promociones de eSports y gráficos de lanzamientos de juegos. Combínalo con fuentes pixeladas o techno y mantén las formas angulosas para dar sensación de velocidad. Consejo: usa magenta solo en acentos como insignias de estado y botones de llamada a la acción.

Ejemplo de imagen de neón crepúsculo generado con media.io

15) Tinte de Tinta Antigua

HEX: #0f0e0b #23211a #3a372b #7a735a #f1eedf

Ambiente: patrimonio, erudito, cálido

Ideal para: folletos de museo y maquetas editoriales

Los negros de tinta y taupes antiguos evocan páginas envejecidas e impresiones de archivo. El blanco cálido simula pergamino y hace que el cuerpo del texto resulte acogedor. Úsalo en folletos de museos, editoriales y branding patrimonial. Combínalo con tipografía serif clásica y reglas sutiles para estructura. Consejo: mantén la imaginería ligeramente desaturada para que combine con el tono vintage.

Ejemplo de imagen de tinta antigua generado con media.io

16) Cola de Cereza Negra

HEX: #0b0708 #220d12 #3d121f #7d1f3a #f7d8df

Ambiente: seductor, brillante, nocturno

Ideal para: menús de cócteles y branding de bar

Rojos de cereza negra sobre casi negro transmiten un brillo como el gas de cola bajo las luces del bar. Estas combinaciones oscuras son ideales para apetito sin llegar a ser estridentes. Úsalo en menús de cócteles, promociones de lounges y etiquetas de botellas con un toque premium. Combínalo con neutros cremosos y un toque de latón para un acabado clásico. Consejo: usa el rosa más pálido solo para bloques pequeños de texto y así mantener el dramatismo del menú.

Ejemplo de imagen de cola de cereza negra generado con media.io

17) Acero Petróleo

HEX: #081013 #10252c #1e3d49 #3f6a78 #d5f0f7

Ambiente: urbano, moderno, resistente

Ideal para: branding automotriz y páginas de productos tecnológicos

Los azules petróleo y verdes acero transmiten un aire urbano, como la lluvia sobre asfalto y metal cepillado. El aqua pálido mantiene fichas técnicas y destacados claros. Úsalo para branding automotriz, páginas de gadgets y sitios tecnológicos B2B. Combínalo con fotografía audaz y sets de íconos minimalistas para ajustarse al tono industrial. Consejo: usa el teal medio para separadores y estados de progreso en lugar de bordes pesados.

Ejemplo de imagen de acero petróleo generado con media.io

18) Arenisca del Crepúsculo

HEX: #0e0b08 #261a12 #4a2d1f #b07a4c #f3e1cf

Ambiente: desierto, cálido, cinematográfico

Ideal para: pósters de viaje y branding de hoteles boutique

Marrones del crepúsculo y ámbares arenisca evocan atardeceres desérticos y paredes soleadas. El beige cremoso apoya tipografía legible para destinos y ofertas. Úsalo en pósters de viaje, marcas de hoteles boutique y lookbooks de estilo de vida. Combínalo con acentos fotográficos en verde petróleo para un equilibrio complementario llamativo. Consejo: reserva el ámbar como franja focal detrás de los titulares en lugar de cubrir todo el fondo.

Ejemplo de imagen de arenisca del crepúsculo generado con media.io

19) Mazmorra Silenciosa

HEX: #070607 #151017 #261a2b #3c2a45 #cdbfd6

Ambiente: gótico, silencioso, atmosférico

Ideal para: portadas de libros de fantasía y menús de juegos

Violetas apagados y grises sombríos evocan antorchas en un corredor de piedra. El lavanda polvoriento permite leer etiquetas de UI y textos de lore. Úsalo en portadas de fantasía, campañas de rol o pantallas de menús de juegos. Combínalo con títulos serif ornamentados o motivos rúnicos sutiles para ambientar. Consejo: añade un viñeteado suave para que el contenido central sea el foco más brillante.

Ejemplo de imagen de mazmorra silenciosa generado con media.io

20) Denim Índigo Ahumado

HEX: #0b0e14 #161e2a #23324a #3a5a86 #e3edf9

Ambiente: casual, confiable, contemporáneo

Ideal para: ecommerce de moda y maquetas de lookbook

El índigo ahumado y los azules denim resultan familiares, como una chaqueta bien usada. El blanco frío permite que los nombres y precios de productos luzcan despejados. Úsalo en ecommerce de moda, lookbooks y newsletters de marca. Combínalo con fotografía de producto minimalista y negro sutil para el texto. Consejo: usa el tono denim medio para estados hover y filtros, logrando una interfaz amigable.

Ejemplo de imagen de denim índigo ahumado generado con media.io

21) Carbón con Toque Cítrico

HEX: #0a0a0c #1e1f25 #3b3f4a #ffb000 #f2f5f8

Ambiente: moderno, vibrante, seguro

Ideal para: branding de startups y páginas enfocadas en CTAs

Neutros carbón con toques cítricos dan una sensación audaz, como etiquetas streetwear y señalización marcada. El ámbar brillante es perfecto para acciones primarias y notificaciones. Úsalo en branding de startups, páginas de conversión y recorridos de producto que requieran jerarquía clara. Combínalo con tipografía geométrica limpia e ilustraciones simples para hacerlo accesible. Consejo: reserva el ámbar para botones e íconos y deja que el carbón sea el protagonista en el resto.

Ejemplo de imagen de carbón con toque cítrico generado con media.io

¿Qué colores combinan bien con el oscuro?

Los neutros oscuros (carbón, tinta, casi negro) combinan fácilmente con blancos rotos y azules grisáceos suaves, logrando tipografía legible y una estructura “editorial”. Si tu diseño se siente demasiado pesado, calienta un poco el color claro (crema o pergamino) para hacerlo más acogedor.

Para acentos, los tonos joya (violeta, teal, zafiro, esmeralda) lucen saturados y premium sobre fondos oscuros. Los metálicos cálidos (cobre, latón, oro suave) añaden contraste sin la crudeza del amarillo puro.

Para productos modernos o UI, limita los acentos: uno primario para acciones, un set semántico para estados (éxito/advertencia/error) y deja el resto en neutros de oscuros a medios.

Cómo usar una paleta de colores oscuros en diseños reales

Comienza eligiendo tu “lienzo” (las dos tonalidades más oscuras) y resérvalas para áreas amplias como fondo de página, secciones hero o envoltorios de app. Después, asigna un tono medio a tarjetas, paneles o navegación, separando componentes sin bordes gruesos.

Usa el matiz más claro de forma estratégica: títulos, métricas clave y texto interactivo. En temas oscuros, la letra pequeña puede perder nitidez, así que aumenta un poco el peso de fuente y evita trazos ultra delgados en los íconos.

Por último, prueba el contraste en contexto. Una paleta oscura se ve genial en muestras, pero puede fallar en maquetas reales si sobresaturas los acentos: usa los toques brillantes solo cuando tengan significado e impacto.

Crea visuales con paletas oscuras usando IA

Si estás creando una landing page, póster o concepto de empaque, genera prototipos alineados a la marca reutilizando los prompts anteriores y cambiando tu producto, tipo de layout y proporción.

Con Media.io Texto a Imagen puedes iterar rápido: prueba palabras de iluminación distintas (luz de recorte, sombra suave, brillo neón), ajusta “sin marco de dispositivo” para vistas previas limpias y deja el fondo plano para facilitar la composición.

Cuando encuentres una dirección que te guste, genera algunas variaciones y elige la de mejor contraste y espaciado; los temas oscuros premian los matices sutiles.

Siguiente: Paleta de colores marrón burdeos