About

Mechanical spider tesselation

Edit Tesselation

CSS Code

background-color: #d6f9c1;
background-image: url('data:image/svg+xml;base64,PHN2ZyAKICB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIAogIHhtbG5zOnhsaW5rPSdodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rJyAKICB3aWR0aD0nMjAnIAogIGhlaWdodD0nMjcnIAogIHZpZXdCb3g9JzAgMCAyMCAyNycKPgogIDxwYXRoIAogICAgc3Ryb2tlPSIjZGZmZGNkIiAKICAgIHN0cm9rZS13aWR0aD0iMTEiCiAgICBmaWxsPSIjZDZmOWMxIiAKICAgIGQ9Ik0gMCwwIEw4LDIgTDgsLTMgUTE2LC0xNyAxNCwtMTAgTDE2LC04IEwyMCwwIFEyNCw0IDI0LDQgUTMyLDcgMjcsNyBMMjAsMjcgTDE2LDE5IEwxNCwxNyBRMTAsMTcgOCwyNCBMOCwyOSBMMCwyNyBMNyw3IFE5LDQgNCw0IFE0LDQgMCwwIFoiIAogICAgaWQ9InJvb3QiPgogIDwvcGF0aD4KCiAgPHVzZSBocmVmPSIjcm9vdCIgeD0iLTIwIiB5PSIwIi8+CiAgPHVzZSBocmVmPSIjcm9vdCIgeD0iMjAiIHk9IjAiLz4KICA8dXNlIGhyZWY9IiNyb290IiB4PSIwIiB5PSIyNyIvPgogIDx1c2UgaHJlZj0iI3Jvb3QiIHg9IjAiIHk9Ii0yNyIvPgo8L3N2Zz4=');
background-size: 17px;

SVG Code

<svg 
  xmlns='http://www.w3.org/2000/svg' 
  xmlns:xlink='http://www.w3.org/1999/xlink' 
  width='20' 
  height='27' 
  viewBox='0 0 20 27'
>
  <path 
    stroke="#dffdcd" 
    stroke-width="11"
    fill="#d6f9c1" 
    d="M 0,0 L8,2 L8,-3 Q16,-17 14,-10 L16,-8 L20,0 Q24,4 24,4 Q32,7 27,7 L20,27 L16,19 L14,17 Q10,17 8,24 L8,29 L0,27 L7,7 Q9,4 4,4 Q4,4 0,0 Z" 
    id="root">
  </path>

  <use href="#root" x="-20" y="0"/>
  <use href="#root" x="20" y="0"/>
  <use href="#root" x="0" y="27"/>
  <use href="#root" x="0" y="-27"/>
</svg>
Download