Skip to content

Instantly share code, notes, and snippets.

@clhenrick

clhenrick/cafe-18.svg

Last active May 1, 2018 08:31
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 3 You must be signed in to fork a gist
  • Save clhenrick/0b73208409a14144e1f5 to your computer and use it in GitHub Desktop.
Save clhenrick/0b73208409a14144e1f5 to your computer and use it in GitHub Desktop.
Download ZIP
Load an SVG from an external page
Display the source blob
Display the rendered blob
Raw
cafe-18.svg
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Raw
index.html
<!doctype HTML>
<hmtl>
<head>
<meta charset="utf8">
<style type="text/css">
* {
-webkit-transform-origin-x: 0px;
-webkit-transform-origin-y: 0px;
-webkit-transform-origin-z: initial;
}
.icon {
width: 180px;
height: 180px;
fill: hsl(0, 100%, 80%);
}
</style>
</head>
<body>
<p>Hello World!</p>
<br>
<!-- code from CSS Tricks: http://css-tricks.com/svg-use-external-source/ -->
<!-- `<use>` shape defined in an EXTERNAL RESOURCE -->
<svg viewBox="0 0 18 18" class="icon">
<use xlink:href="cafe-18.svg#svg4619"></use>
</svg>
</body>
</hmtl>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment