Skip to content

Instantly share code, notes, and snippets.

@moul
Last active November 14, 2015 09:00
Show Gist options
  • Save moul/3725db48bb31f7ce3fb8 to your computer and use it in GitHub Desktop.
Save moul/3725db48bb31f7ce3fb8 to your computer and use it in GitHub Desktop.
fractal svg
<html><body>
<svg width="100%" height="100%">
<defs>
<path id="level_0" fill="#003399" d="M0 0,2 0,1 1.732,z" />
<g id="level_1">
<use xlink:href="#level_0" transform="matrix(0.5 0 0 0.5 0 0)" />
<use xlink:href="#level_0" transform="matrix(0.5 0 0 0.5 1 0)" />
<use xlink:href="#level_0" transform="matrix(0.5 0 0 0.5 0.5 0.866)" />
</g>
<g id="level_2">
<use xlink:href="#level_1" transform="matrix(0.5 0 0 0.5 0 0)" />
<use xlink:href="#level_1" transform="matrix(0.5 0 0 0.5 1 0)" />
<use xlink:href="#level_1" transform="matrix(0.5 0 0 0.5 0.5 0.866)" />
</g>
<g id="level_3">
<use xlink:href="#level_2" transform="matrix(0.5 0 0 0.5 0 0)" />
<use xlink:href="#level_2" transform="matrix(0.5 0 0 0.5 1 0)" />
<use xlink:href="#level_2" transform="matrix(0.5 0 0 0.5 0.5 0.866)" />
</g>
<g id="level_4">
<use xlink:href="#level_3" transform="matrix(0.5 0 0 0.5 0 0)" />
<use xlink:href="#level_3" transform="matrix(0.5 0 0 0.5 1 0)" />
<use xlink:href="#level_3" transform="matrix(0.5 0 0 0.5 0.5 0.866)" />
</g>
<g id="level_5">
<use xlink:href="#level_4" transform="matrix(0.5 0 0 0.5 0 0)" />
<use xlink:href="#level_4" transform="matrix(0.5 0 0 0.5 1 0)" />
<use xlink:href="#level_4" transform="matrix(0.5 0 0 0.5 0.5 0.866)" />
</g>
<g id="level_6">
<use xlink:href="#level_5" transform="matrix(0.5 0 0 0.5 0 0)" />
<use xlink:href="#level_5" transform="matrix(0.5 0 0 0.5 1 0)" />
<use xlink:href="#level_5" transform="matrix(0.5 0 0 0.5 0.5 0.866)" />
</g>
<g id="level_7">
<use xlink:href="#level_6" transform="matrix(0.5 0 0 0.5 0 0)" />
<use xlink:href="#level_6" transform="matrix(0.5 0 0 0.5 1 0)" />
<use xlink:href="#level_6" transform="matrix(0.5 0 0 0.5 0.5 0.866)" />
</g>
</defs>
<use xlink:href="#level_7" transform="translate(0,0) scale(500)" />
</svg>
</body></html>
Display the source blob
Display the rendered blob
Raw
<svg xmlns="http://www.w3.org/2000/svg" height="800" width="800">
<defs>
<path id="level_0" fill="#003399" d="M0 0,2 0,1 1.732,z" />
<g id="level_1">
<use xlink:href="#level_0" transform="matrix(0.5 0 0 0.5 0 0)" />
<use xlink:href="#level_0" transform="matrix(0.5 0 0 0.5 1 0)" />
<use xlink:href="#level_0" transform="matrix(0.5 0 0 0.5 0.5 0.866)" />
</g>
<g id="level_2">
<use xlink:href="#level_1" transform="matrix(0.5 0 0 0.5 0 0)" />
<use xlink:href="#level_1" transform="matrix(0.5 0 0 0.5 1 0)" />
<use xlink:href="#level_1" transform="matrix(0.5 0 0 0.5 0.5 0.866)" />
</g>
<g id="level_3">
<use xlink:href="#level_2" transform="matrix(0.5 0 0 0.5 0 0)" />
<use xlink:href="#level_2" transform="matrix(0.5 0 0 0.5 1 0)" />
<use xlink:href="#level_2" transform="matrix(0.5 0 0 0.5 0.5 0.866)" />
</g>
<g id="level_4">
<use xlink:href="#level_3" transform="matrix(0.5 0 0 0.5 0 0)" />
<use xlink:href="#level_3" transform="matrix(0.5 0 0 0.5 1 0)" />
<use xlink:href="#level_3" transform="matrix(0.5 0 0 0.5 0.5 0.866)" />
</g>
<g id="level_5">
<use xlink:href="#level_4" transform="matrix(0.5 0 0 0.5 0 0)" />
<use xlink:href="#level_4" transform="matrix(0.5 0 0 0.5 1 0)" />
<use xlink:href="#level_4" transform="matrix(0.5 0 0 0.5 0.5 0.866)" />
</g>
<g id="level_6">
<use xlink:href="#level_5" transform="matrix(0.5 0 0 0.5 0 0)" />
<use xlink:href="#level_5" transform="matrix(0.5 0 0 0.5 1 0)" />
<use xlink:href="#level_5" transform="matrix(0.5 0 0 0.5 0.5 0.866)" />
</g>
<g id="level_7">
<use xlink:href="#level_6" transform="matrix(0.5 0 0 0.5 0 0)" />
<use xlink:href="#level_6" transform="matrix(0.5 0 0 0.5 1 0)" />
<use xlink:href="#level_6" transform="matrix(0.5 0 0 0.5 0.5 0.866)" />
</g>
</defs>
<use xlink:href="#level_7" transform="translate(0,0) scale(500)" />
</svg>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment