About

Fast pony tesselation

Edit Tesselation

CSS Code

background-color: #f6fffe;
background-image: url('data:image/svg+xml;base64,PHN2ZyAKICB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIAogIHhtbG5zOnhsaW5rPSdodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rJyAKICB3aWR0aD0nMzMnIAogIGhlaWdodD0nMTIwJyAKICB2aWV3Qm94PScwIDAgMzMgMTIwJwo+CiAgPHBhdGggCiAgICBzdHJva2U9IiNmY2VlZWYiIAogICAgc3Ryb2tlLXdpZHRoPSIxNiIKICAgIGZpbGw9IiNmNmZmZmUiIAogICAgZD0iTSAwLDAgTDEsMjQgUTU4LC0yNiAzMywwIFE0MiwzIDM5LDE2IEw0MCwyNyBRNDMsODggNDEsODMgUTIwLDEyMiAzMywxMjAgUTU4LDk0IDEsMTQ0IEwwLDEyMCBRLTEzLDEyMiA4LDgzIFE5LDMyIDcsMjcgTDYsMTYgUTksMyAwLDAgWiIgCiAgICBpZD0icm9vdCI+CiAgPC9wYXRoPgoKICA8dXNlIGhyZWY9IiNyb290IiB4PSItMzMiIHk9IjAiLz4KICA8dXNlIGhyZWY9IiNyb290IiB4PSIzMyIgeT0iMCIvPgogIDx1c2UgaHJlZj0iI3Jvb3QiIHg9IjAiIHk9IjEyMCIvPgogIDx1c2UgaHJlZj0iI3Jvb3QiIHg9IjAiIHk9Ii0xMjAiLz4KPC9zdmc+');
background-size: 11px;

SVG Code

<svg 
  xmlns='http://www.w3.org/2000/svg' 
  xmlns:xlink='http://www.w3.org/1999/xlink' 
  width='33' 
  height='120' 
  viewBox='0 0 33 120'
>
  <path 
    stroke="#fceeef" 
    stroke-width="16"
    fill="#f6fffe" 
    d="M 0,0 L1,24 Q58,-26 33,0 Q42,3 39,16 L40,27 Q43,88 41,83 Q20,122 33,120 Q58,94 1,144 L0,120 Q-13,122 8,83 Q9,32 7,27 L6,16 Q9,3 0,0 Z" 
    id="root">
  </path>

  <use href="#root" x="-33" y="0"/>
  <use href="#root" x="33" y="0"/>
  <use href="#root" x="0" y="120"/>
  <use href="#root" x="0" y="-120"/>
</svg>
Download