El modo oscuro es un esquema de color invertido que utiliza texto, iconos y otros elementos de color claro sobre un fondo oscuro. Se puede activar en tu dispositivo —y en algunos casos dentro de un cliente de correo electrónico— y afecta a cómo aparecen los correos electrónicos, dependiendo del cliente (como Outlook y Gmail), tanto en dispositivos de escritorio como móviles.
Activar el modo claro u oscuro en diferentes dispositivos.
Los contactos pueden activar el modo claro o el modo oscuro en su teléfono Android, dispositivo iOS, Mac o PC.
En iOS:
- Ve a Configuración .
- Ir a la pantalla & Brillo.
- Pulsa Modo claro o Modo oscuro .
En Android:
- Ve a Configuración .
- Ir a la pantalla & Brillo.
- Pulsa Modo claro o Modo oscuro .
En Mac:
- Ve a la aplicación Configuración del sistema .
- Haz clic en Apariencia en la barra lateral.
- Desplácese hacia abajo y seleccione Automático , Claro o Oscuro .
En PC:
- Haz clic derecho en cualquier espacio vacío de tu escritorio.
- Seleccione Personalizar .
- Seleccionar Colores
- Cambia "Elige tu modo" (o "Elige tu color") a Claro o Oscuro .
|
Ejemplo de modo claro (dispositivo iOS)
|
Ejemplo de modo oscuro (dispositivo iOS)
|
 |
 |
Cómo afecta el modo oscuro a los correos electrónicos
Cuando se activa el modo oscuro, puede afectar la apariencia de un correo electrónico de tres maneras diferentes, dependiendo del cliente de correo electrónico y de si el correo electrónico se visualiza en un ordenador de escritorio o en un dispositivo móvil:
- Sin cambio de color - el fondo y el texto no se verán afectados
- Inversión parcial de color - el fondo claro y el texto se vuelven oscuros
- Inversión de color completa - el fondo y el texto claros se vuelven oscuros, y el fondo y el texto oscuros se vuelven claros
Dado que es una configuración que los destinatarios pueden activar o desactivar por sí mismos, no puedes controlar su impacto en la apariencia de tus correos electrónicos. En definitiva, si el destinatario decide activar el modo oscuro, tus correos electrónicos se mostrarán como él prefiera.
Nota: Muchos factores de terceros afectan la forma en que se muestra el contenido en modo oscuro. No podemos obligar al programa receptor a mostrar el correo electrónico con una combinación de colores específica ni impedir que se aplique el modo oscuro. El programa receptor determina cómo mostrar el correo electrónico.
| Ejemplo de un correo electrónico en modo claro en Gmail | Ejemplo de un correo electrónico en modo oscuro en Gmail |
 |  |
Consejos para diseñar correos electrónicos teniendo en cuenta el modo oscuro.
Si bien no se puede garantizar que un correo electrónico se vea igual en todos los clientes y modos de correo electrónico, existen algunas buenas prácticas que se pueden seguir al diseñar un correo electrónico para garantizar que siga siendo accesible y tenga buen aspecto tanto en el modo claro como en el oscuro.
Logotipo e imágenes
- Usar PNG transparentes: Importa imágenes con fondos transparentes para que se integren perfectamente al cambiar de tema.
- Agregue contornos o brillos claros: Aplique un sutil trazo blanco, sombra paralela o brillo exterior alrededor de logotipos oscuros, íconos e insignias sociales. Esto permite que los gráficos oscuros sean visibles si un cliente de correo electrónico fuerza el cambio a color negro.
- No incluyas texto en las imágenes: Utiliza el cuerpo del correo electrónico en lugar de insertar texto en las imágenes. El texto en tiempo real se adapta dinámicamente a la configuración de contraste y sigue siendo totalmente legible para los lectores de pantalla.
Color y contraste
- Evite el negro puro y el blanco puro: Manténgase alejado de usar #000000 texto en #FFFFFF antecedentes (o viceversa). El contraste extremo puede provocar una fuerte fatiga visual y dar lugar a inversiones automáticas agresivas en aplicaciones como Gmail y Outlook. Opta por carbones oscuros. (#121212, #1E293B) y blancos rotos suaves (#E2E8F0, #F7F7F7) en cambio.
- Aprovecha los tonos medios: Incorpora colores de tonos medios a tu paleta para mantener la visibilidad independientemente de si un cliente de correo electrónico utiliza inversión de color parcial o total.
- Busca la accesibilidad: Asegúrate de que los colores del texto y del fondo tengan una relación de contraste de al menos 4.5:1 para texto normal y 3:1 para textos grandes para facilitar el acceso a usuarios con baja visión o daltonismo. Puedes validar tus ratios con herramientas en línea, como el Comprobador de contraste de WebAIM .
Texto y botones
- Ajustar el grosor de la fuente: El texto claro suele aparecer más delgado sobre fondos oscuros. Evite las fuentes delgadas y opte por fuentes medianas o en negrita para mejorar la legibilidad.
- Use botones de color sólido: Use colores sólidos y vibrantes para los botones de llamada a la acción en lugar de estilos transparentes o solo con borde para que destaquen en cualquier tema.
- No confíes solo en el color: Combina los colores de los hipervínculos con subrayados o iconos para que los enlaces sigan siendo visibles incluso si un cliente cambia tu espectro de color.
Prueba en diferentes clientes de correo electrónico
Dado que el modo oscuro se comporta de manera diferente en cada cliente de correo electrónico, envía una versión de prueba de tu correo y previsualízala en varias bandejas de entrada y dispositivos con el modo oscuro activado para detectar cualquier problema de diseño antes de enviarlo a tus contactos.
 | ¿Sabía que…? Vista previa de la bandeja de entrada te permite previsualizar fácilmente tus correos electrónicos en una variedad de clientes de correo electrónico, incluidas aplicaciones de escritorio y móviles, ¡e incluso el modo oscuro para dispositivos móviles! |