Skip to content

Instantly share code, notes, and snippets.

@charlie-s

charlie-s/gist:1175bf9374dbc83046e7

Created December 9, 2014 02:07
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save charlie-s/1175bf9374dbc83046e7 to your computer and use it in GitHub Desktop.
Save charlie-s/1175bf9374dbc83046e7 to your computer and use it in GitHub Desktop.
Download ZIP
SVG Polygon Mask
Raw
gistfile1.xml
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="300px" height="300px" viewBox="0 0 500 500">
<defs>
<clipPath id="clip1">
<polygon points="250,20 480,100 480,400 250,480 20,400 20,100"></polygon>
</clipPath>
</defs>
<polygon points="250,20 480,100 480,400 250,480 20,400 20,100" stroke="#aaaa99" stroke-width="30" stroke-linejoin="round"></polygon>
<image xlink:href="https://c2.staticflickr.com/4/3650/3513935402_a1d2a3db9b.jpg" width="500" height="500" clip-path="url(#clip1)"></image>
</svg>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment