This SVG example illustrates how to color a rectangle with a linear color gradient.

LinearGradient.svg

<svg height="150" width="400" xmlns="http://www.w3.org/2000/svg">
  <defs>
    <linearGradient id="idLinGrad" x1="0%" y1="0%" x2="0%" y2="100%">
      <stop offset="10%" style="stop-color:rgb(255,255,255);stop-opacity:1" />
      <stop offset="90%" style="stop-color:rgb(32,32,255);stop-opacity:1" />
    </linearGradient>
  </defs>
  <rect x="25" y="25" width="350" height="250" fill="url(#idLinGrad)" />
  <text fill="#eeeeff" font-size="60" font-family="Verdana" x="60" y="125">XoaX.net</text>
</svg>

Output