Skip to content

Instantly share code, notes, and snippets.

@atomgroom

atomgroom/Animate SVG inside clippath

Created January 2, 2015 17:59
Show Gist options
  • Save atomgroom/de5c200548222d6037db to your computer and use it in GitHub Desktop.
Save atomgroom/de5c200548222d6037db to your computer and use it in GitHub Desktop.
Download ZIP
Raw
Animate SVG inside clippath
<svg height="131" width="131">
<image class="icon-homepage-circle-masked" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="svg/icon-circle-fill.svg" width="131" height="131"></image>
<defs>
<clipPath id="svgPath">
<path fill="#CB3036" fill-opacity="0.0" d="M64.8,129.6C29.1,129.6,0,100.5,0,64.8C0,29.1,29.1,0,64.8,0s64.8,29.1,64.8,64.8
C129.6,100.5,100.5,129.6,64.8,129.6z M64.8,2C30.2,2,2,30.2,2,64.8c0,34.6,28.2,62.8,62.8,62.8c34.6,0,62.8-28.2,62.8-62.8
C127.6,30.2,99.4,2,64.8,2z"/>
</clipPath>
</defs>
</svg>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment