Previewing Gmail with Emailens

Looking for the full per-feature CSS support data rather than how the preview works? See the Full CSS support reference on emailens.dev.

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