<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1 plus MathML 2.0 plus SVG 1.1//EN" "http://www.w3.org/2002/04/xhtml-math-svg/xhtml-math-svg.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:svg="http://www.w3.org/2000/svg">
<head>
<style type="text/css">
  svg {background: black; width: 100px; height: 100px;}
</style>
</head>
<body>

<svg:svg>

<svg:g>
<svg:linearGradient id="gradient" gradientUnits="userSpaceOnUse" x1="0" y1="100" x2="100" y2="0">
  <svg:stop offset="0" style="stop-color:rgba(255,255,0,1)"/>
  <svg:stop offset="1" style="stop-color:rgba(255,0,255,0);stop-opacity:0"/>
</svg:linearGradient>
<svg:path fill="url(#gradient)" d="M0,0v100h100V0H0z" />
</svg:g>

</svg:svg>

</body>
</html>