About

Foolish rook tesselation

Edit Tesselation

CSS Code

background-color: #a9f3b5;
background-image: url('data:image/svg+xml;base64,PHN2ZyAKICB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIAogIHhtbG5zOnhsaW5rPSdodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rJyAKICB3aWR0aD0nNzQnIAogIGhlaWdodD0nMTE5JyAKICB2aWV3Qm94PScwIDAgNzQgMTE5Jwo+CiAgPHBhdGggCiAgICBzdHJva2U9IiNhMmMyYTciIAogICAgc3Ryb2tlLXdpZHRoPSIyNCIKICAgIGZpbGw9IiNhOWYzYjUiIAogICAgZD0iTSAwLDAgUTEsLTEgMTcsLTEgTDM0LC0xNyBRNzcsLTUzIDcwLC0yOSBRNzUsNDcgNzQsMCBMNTksMTExIEw3NCwxMTkgUTc1LDE2NiA3MCw5MCBRNDEsNzggMzQsMTAyIEwxNywxMTggUTEsMTE4IDAsMTE5IEwtMTUsMTExIEwwLDAgWiIgCiAgICBpZD0icm9vdCI+CiAgPC9wYXRoPgoKICA8dXNlIGhyZWY9IiNyb290IiB4PSItNzQiIHk9IjAiLz4KICA8dXNlIGhyZWY9IiNyb290IiB4PSI3NCIgeT0iMCIvPgogIDx1c2UgaHJlZj0iI3Jvb3QiIHg9IjAiIHk9IjExOSIvPgogIDx1c2UgaHJlZj0iI3Jvb3QiIHg9IjAiIHk9Ii0xMTkiLz4KPC9zdmc+');
background-size: 99px;

SVG Code

<svg 
  xmlns='http://www.w3.org/2000/svg' 
  xmlns:xlink='http://www.w3.org/1999/xlink' 
  width='74' 
  height='119' 
  viewBox='0 0 74 119'
>
  <path 
    stroke="#a2c2a7" 
    stroke-width="24"
    fill="#a9f3b5" 
    d="M 0,0 Q1,-1 17,-1 L34,-17 Q77,-53 70,-29 Q75,47 74,0 L59,111 L74,119 Q75,166 70,90 Q41,78 34,102 L17,118 Q1,118 0,119 L-15,111 L0,0 Z" 
    id="root">
  </path>

  <use href="#root" x="-74" y="0"/>
  <use href="#root" x="74" y="0"/>
  <use href="#root" x="0" y="119"/>
  <use href="#root" x="0" y="-119"/>
</svg>
Download