This SVG example illustrates how to use a simple clipping path.

ClippedSimplePath.svg

<svg width="405" height="205" xmlns="http://www.w3.org/2000/svg">
  <defs>
    <clipPath id="idClipPath">
      <circle cx="100" cy="115" r="90"/>
    </clipPath>
  </defs>
  <!-- The original path -->
  <path
      d="M 50,25
      V 200
      H 200
      L 150,100 Z"
      fill="red" stroke="black" stroke-width="6"/>
  <!-- The clipped and transformed path -->
  <path transform="translate(200, 0)" clip-path="url(#idClipPath)"
      d="M 50,25
      V 200
      H 200
      L 150,100 Z"
      fill="red" stroke="black" stroke-width="6"/>
</svg>

Output