background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#f47e38), to(#ec600d));
I start the program with:
wkhtmltopdf --page-width 1016 --page-height 812.8 --zoom 2 index.html export.pdf
When it gets rendered by wkhtmltopdf I get the following message:
Loading pages (1/6)
QFont::setPixelSize: Pixel size <= 0 (0)                     ] 42%
Counting pages (2/6)
Resolving links (4/6)
Loading headers and footers (5/6)
Printing pages (6/6)
QPainter::begin: Paint device returned engine == 0, type: 3==] Page 1 of 1
QPainter::setOpacity: Painter not active
QPainter::translate: Painter not active
QPainter::setWorldTransform: Painter not active
QPainter::setPen: Painter not active
QPainter::setBrush: Painter not active
QPainter::setBackground: Painter not active
QPainter::setBackgroundMode: Painter not active
QPainter::setBrushOrigin: Painter not active
QPainter::setRenderHint: Painter must be active to set rendering hints
QPainter::setRenderHint: Painter must be active to set rendering hints
QPainter::drawPath: Painter not active
QPainter::end: Painter not active, aborted
In the browser the gradient looks like:

In the resulting PDF it looks like:

          
I am also getting this. I realized it's because you use borders combined with a gradient background on the same element.
It is a bug ... so hopefully it will be fixed.
          
looking for a solution for this also. The syntax above by @KaiqueCovo worked for me... but it only works with 2 colors & I want a 3-color gradient.
e.g. (using scss variables)

Works:

background-image: -webkit-linear-gradient(left, $report-green, $report-red);

Does not work:

background-image: -webkit-linear-gradient(left, $report-green, $report-yellow, $report-red);
Ideas?

(edited for clarity)
          
UPDATE/SOLVED

After playing around with this I find that this works best:
background-image: -o-linear-gradient(left, $report-green 0%, $report-yellow 50%, $report-red 100%);
background-image: linear-gradient(to right, $report-green 0%, $report-yellow 50%, $report-red 100%);
background-image: -webkit-linear-gradient(left, $report-green 0%, $report-yellow 50%, $report-red 100%);
The percentages are required for more than 2 colors. The order of the prefixes matters - if the webkit prefix is not last, this does not work.
          
None of the solutions given above worked for me, as I was trying to convert the html to pdf. Background gradient in the PDF was visible in some softwares but not on others. So, as a work-around I had to use an top-to-bottom gradient image which I could repeat in the background-image.

I hope someone with my kind of requirement finds this work-around useful.