Does html2pdf support gradients

Question

I've got the following HTML and CSS:

<div id="previewBox" style="background: #1e5799;
background: -moz-linear-gradient(top,  #1e5799 0%, #7db9e8 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#1e5799), color-stop(100%,#7db9e8));
background: -webkit-linear-gradient(top,  #1e5799 0%,#7db9e8 100%);
background: -o-linear-gradient(top,  #1e5799 0%,#7db9e8 100%);
background: -ms-linear-gradient(top,  #1e5799 0%,#7db9e8 100%);
background: linear-gradient(to bottom,  #1e5799 0%,#7db9e8 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1e5799', endColorstr='#7db9e8',GradientType=0 );
height:800px;border: 1px solid black;">
<font style="font-size:100pt;family:georgia;color:#3333FF">Some blue text here...</font>
</div>

Which I would like converted to PDF using html2pdf, but it doesn't seem to work. Is it possible to convert gradients with html2pdf?

Answer 1

I decided to not use html2pdf, but just use the core tcftp which does support linear gradients.

Answer 2

It depends on how you convert it to a PDF. If you use PHP, you could generate an image through PHP's GD Library and set that as the background of the div.

Found an example you could use right here and a live example right here

Then change your div's style attribute to this:

  <div id="previewBox" style="background-image: url('path/to/gradiant.php?start=1e5799&end=7db9e8">

Don't forget to alter the width and height of the generated background gradient in PHP. Best practice would be a width of 1 pixel and height of the div's height.