Me gustaría no solo cambiar los colores del texto, sino también varias imágenes e íconos en los correos electrónicos. ¿Es posible/debería usar media-query como dicen los documentos? ¿Debería usar display: none , display: block para imágenes, en diferentes condiciones de día y noche? ¿No interferirán los diferentes clientes de correo electrónico?
https://www.litmus.com/blog/the-ultimate-guide-to-dark-mode-for-email-marketers/
Parece el camino a seguir (usando los @media y [data-ogsc] ).
"¿Los diferentes clientes de correo electrónico no interferirán con eso?"
Los documentos dicen:
"Como se señaló anteriormente, la forma en que los clientes de correo electrónico en modo oscuro manejan sus correos electrónicos HTML regulares variará".
Por lo tanto, no puede estar seguro de si sus estilos se anularán o no; eso depende de la interpretación de los diversos y numerosos clientes de correo.
Como mencionan los documentos, @media (prefers-color-scheme: dark) le permite crear los temas de modo oscuro personalizados más sólidos donde puede implementar cualquier cosa, desde intercambios de imágenes específicos del modo oscuro, efectos de desplazamiento, imágenes de fondo, mientras que [data-ogsc] a cada regla de CSS, apunte específicamente a la aplicación de Outlook.
"¿Debería usar display: none, display: block para imágenes, en diferentes condiciones de día y noche?"
Podría ser una opción, es decir, obtener el tiempo del sistema de los clientes a través de JS al abrir/leer el correo.
Aunque tenga en cuenta:
Los clientes antiguos, como Lotus Notes, Mozilla Thunderbird, Outlook Express y Windows Live Mail, parecen haber admitido algún tipo de ejecución de JavaScript. Nada más lo hace.
Parece una mala idea en cuanto a la seguridad, por lo que esperaría que esta sea una función que no siempre estará presente, incluso en estos clientes.
Como se indica en la respuesta aceptada a esta pregunta
Entonces, nuevamente, no puede confiar en que JS esté habilitado / permitido en los diversos clientes (incluso en los scripts de plantilla de mensaje).