Example


<svg width="400px" height="120px" version="1.1">
     <desc>Example Skew - Show effects of skewX and skewY</desc>
     <g fill="none" stroke="black" stroke-width="3">
          <line x1="0" y1="1.5" x2="400" y2="1.5"/>
          <line x1="1.5" y1="0" x2="1.5" y2="120"/>
     </g>
     <g transform="translate(30,30)">
          <g transform="skewX(30)">
               <g fill="none" stroke="red" stroke-width="3">
                    <line x1="0" y1="0" x2="50" y2="0"/>
                    <line x1="0" y1="0" x2="0" y2="50"/>
               </g>
               <text x="0" y="0" font-size="20" font-family="Verdana" fill="blue"> ABC (skewX) </text>
          </g>
     </g>
     <g transform="translate(200,30)">
          <g transform="skewY(30)">
               <g fill="none" stroke="red" stroke-width="3">
                    <line x1="0" y1="0" x2="50" y2="0"/>
                    <line x1="0" y1="0" x2="0" y2="50"/>
               </g>
               <text x="0" y="0" font-size="20" font-family="Verdana" fill="blue"> ABC (skewY) </text>
          </g>
     </g>
</svg>
Original SVG source