Paletas de colores oscuras

Las paletas oscuras son rampas con luminosidad baja en la mayoría de stops, ideales para dark mode, dashboards de datos, apps de gaming, audio y herramientas creativas que requieren reducir fatiga visual en sesiones largas.

Cuándo usar una paleta oscura

• Dark mode en apps web y móviles.
• Dashboards y herramientas técnicas donde el dato debe destacar sobre el fondo.
• Productos de medios (música, video, gaming) que se consumen en entornos con poca luz.
• Branding premium o tecnológico que busca transmitir sofisticación o foco.

Reglas para una paleta oscura efectiva

1. Evita el negro puro (#000) como fondo principal. Usa un gris muy oscuro con un poco de matiz cálido o frío (ej. oklch(15% 0.01 250)) para evitar el efecto "sombra recortada".
2. Mantén el contraste WCAG AA o AAA entre texto y fondo. En dark mode, el texto debe ser claro pero no blanco puro: usa #f4ece0 o similar.
3. Limita la saturación de los acentos. Colores muy saturados sobre fondo oscuro vibran y cansan la vista. Reduce el croma un 15-20% respecto a la versión light mode.
4. Diseña pares light/dark coherentes: el mismo matiz en OKLCH con L distinta produce un dark mode armónico sin reinventar la paleta.

Tendencias dark mode en 2026

• Fondos cálidos (gris-marrón) en vez de azulados, más fáciles para sesiones nocturnas.
• Acentos saturados con croma controlado: verdes oliva, ámbar tostado, magentas reducidas.
• Stops intermedios bien definidos para badges, separadores, hover states.

Cómo crear una paleta oscura en Paletadecolor.es

1. En el editor avanzado, baja el slider de luminosidad máxima en la curva L.
2. Reduce el croma un 15-20% respecto a tu paleta light.
3. Activa el modo oscuro del editor para previsualizar el resultado en contexto.
4. Verifica WCAG AA en pares texto/fondo.
5. Exporta a CSS Variables con prefijo --dark- o como Tailwind theme.extend.colors.dark.