CODEWITHSUNDEEP
androidcssgmailmailchimp
Robert
Robert

Reputation: 137

Mailchimp and Gmail: text color distorted

I am having an issue with Mailchimp and the Gmail app for Android. Somehow the Gmail app for Android ignores/distorts colors specified in the style tags. We are already aware from this thread that we have to use the inline style element. However, for some reason the Gmail app distorts the colors we specify.

Here is the code sample, where we assign various colors via the span tag.

<span style="color:#FF0000">Seit 6.1.2021 biete ich ein &quot;<strong>Jodler Abonnement</strong>&quot; an, das ist ein E-Mail, in dem ich jeden Mittwoch einen Jodler in seinen Einzelstimmen und Gesamtklang verschicke.&nbsp;Das Abonnement hat eine Gegenleistung in selbst definierter H&ouml;he / Untergrenze 5&euro; pro Woche. Ich habe vor, das bis Ende M&auml;rz anzubieten und m&ouml;chte mir selbst bislang unbekannte Jodler aus B&uuml;chern aneignen und aufnehmen. Ich freue mich &uuml;ber Anmeldungen via Kontaktformular oder E-Mail.</span>

<p><span style="color:#0000FF">Der<a href="https://www.jodel.space/event/jodelstammtisch-dezember/" target="_blank"> </a><a href="https://www.jodel.space/event/jodelstammtisch-dezember/" target="_blank">Stammtisch </a>am 27. J&auml;nner 2021 ist wieder ab 17:30 und ist dieses Mal wieder online auf Zoom (Download der Software&nbsp;<a href="https://zoom.us/support/download" target="_blank">hier</a>).&nbsp;Da&nbsp;findet der freie Stammtisch statt, wo gemeinsam online gejodelt wird. Jede/r TeilnehmerIn kann nach Lust und Laune&nbsp;ansingen. Einstieg <a href="https://us02web.zoom.us/j/87194528107?pwd=L0dqb00yNmNmQVJldWVyRlVtM2dDUT09" target="_blank">hier</a>.</span><br />
<span style="color:#0000D0">Die Unterrichtseinheit ist von 17:30 bis 19:00 und kostet 12&euro; (&Uuml;berweisung auf AT89 1400 0049 1079 6513).&nbsp;</span></p>

And here is the screenshot: the red works, everything else is displayed in a different color, but not the color specified in the code.

enter image description here

This issue ONLY affects the Gmail app on Android. In the Gmail app on iOS everything is displayed correctly, in the Gmail web interface as well.

Does anyone have clue what causes this issue and how we can solve it? Thanks for your support!

Regards, Robert

Upvotes: 1

Views: 2796

Answers (1)

Subhrajyoti Sen
Subhrajyoti Sen

Reputation: 1735

This is most likely because of dark mode being applied on the GMail app in the screenshot. Android is changing colors to maintain contrast between foreground and background.

You will have to make changes in your CSS to accommodate for clients that are using a dark theme.

You can search online for many guides to support dark theme in email HTML. One such link: https://htmlemail.io/blog/dark-mode-email-styles

Upvotes: 1

Related Questions