Gmail

Gmail is one of the most restrictive email clients for CSS support. Emailens covers three Gmail variants.

Variants

All three support dark mode, but behave differently: Gmail Web only darkens the UI chrome (email content is unchanged), Gmail iOS applies full color inversion, and Gmail Android applies partial inversion.

Key behaviors

• Strips <style> blocks — Gmail removes <style> tags in most contexts. All CSS must be inlined.
• Strips class attributes — CSS classes are removed, making class-based styling unreliable.
• No flexbox or grid — display: flex and display: grid are unsupported. Use tables for layout.
• No position — position: relative/absolute/fixed is stripped.
• No box-shadow — shadows are completely removed.
• No opacity — transparency is not supported.
• Limited background-image — background images have partial support (inline only).
• No border-radius — rounded corners are stripped.
• Limited margin — negative margins and margin on certain elements are unreliable.

Recommendations

1. Use inline styles for all critical styling
2. Use table-based layouts instead of flexbox/grid
3. Use solid background colors instead of background images
4. Avoid border-radius — use images for rounded elements if needed
5. Test both light and dark mode variants