SVG and Canvas

Gradient

<svg xmlns="http://www.w3.org/2000/svg"
     xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve"
         width="100%" height="200" viewBox="0 0 1200 200" >
        <defs>
        <linearGradient id="myFillGrad" >
            <stop offset="5%" stop-color="red" />
            <stop offset="95%" stop-color="blue" stop-opacity="0.5" />
        </linearGradient>
        </defs>

        <!-- Gradient Example -->
    <rect x="20" y="20" width="1160" height="160" fill="url(#myFillGrad)" stroke="black" 
        stroke-width="2" />
</svg>

José M. Vidal .

21 of 24