Gradient fill backgrounds

jambo90210

I would like to add a gradient fill to a column, I managed to acheive this by editing the Blocks HTML and adding the below
style="background-image: linear-gradient(to bottom, #1d3b6f , #f07f25)"

however looks good in the editor, but when it's emailed does not work with outlook.. Is there any chance the functionality can be enhanced to allow you to do gradient fills for background as currently it's only solid colours?
OR does someone know how to do this so it works with outlook and other email clients also?

Thanks in advance

mihha

We can't enhance something that email clients are not supporting. You saw by yourself that gradient fill is not working in Outlook and I would say that majority of other email clients also don't support this

jambo90210

See link, this is from another "newsletter builder", it works with Outlook, perhaps you can review how they do it?

jafs.com.au/tmp/TEST%20-%20The%20Tools%20to%20Unlock%20Manufacturing%20Efficiency.eml

jambo90210

             <!--[if gte mso 9]>
              <table align="center" cellpadding="0" cellspacing="0" role="presentation" bgcolor="#ffffff">
                <tr class="layout-fixed-width">
                  <td style="width:375px;" valign="top"><v:rect xmlns:v="urn:schemas-microsoft-com:vml" fill="true" stroke="false" style="width:375px;">
				<v:fill type="gradient" color="#1d3b6f" color2="#f07f25" angle="180" />
				<v:textbox style="mso-fit-shape-to-text:true" inset="0,0,0,0">            
				<div>
                    <![endif]-->

jvstratum

jambo90210

Please read this article about background colors and gradients in emails. It explains how to use them and explains the different fallbacks you need to make your design working across email clients and darkmode.

https://www.litmus.com/blog/background-colors-html-email

mihha

If I am not mistaken, this will work only with Outlook

jambo90210

Thanks @jvstratum, that's actually really useful and a great response.