When social icons in emails change color in dark mode, it’s because some email clients automatically invert image colors to fit the dark mode theme. This typically happens with icons that have transparent backgrounds or are built with CSS. While this helps icons adapt to dark themes, it can result in issues where the icons switch from white to black, which may not be ideal for your design.
To avoid this, you can try a few solutions:
- Use **SVG images** instead of standard image formats like PNG or JPEG. SVGs are often less affected by dark mode settings and respect the styling you apply.
- **Embed the icons using CSS** or base64 encoding, so the images are part of the email’s code and are less likely to be altered by dark mode.
- Make sure your social icons have a **transparent background** or specify a color directly in the `img` tag. This can prevent email clients from automatically adjusting the icon’s colors.
As for tracking which email clients your subscribers are using, HubSpot’s built-in reporting tools give you insights into open rates and device usage, but it doesn’t go into the level of detail provided by tools like Litmus, which show specific email client data. If you need detailed analytics, integrating Litmus with HubSpot is your best bet. Without accessing the HTML directly, HubSpot won’t provide the same depth of client-specific data on its own, but external tools like Litmus can fill that gap.