About

Advanced jay tesselation

Edit Tesselation

CSS Code

background-color: #c6e8ec;
background-image: url('data:image/svg+xml;base64,PHN2ZyAKICB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIAogIHhtbG5zOnhsaW5rPSdodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rJyAKICB3aWR0aD0nMTgnIAogIGhlaWdodD0nNzInIAogIHZpZXdCb3g9JzAgMCAxOCA3MicKPgogIDxwYXRoIAogICAgc3Ryb2tlPSIjZWRiOGIxIiAKICAgIHN0cm9rZS13aWR0aD0iMyIKICAgIGZpbGw9IiNjNmU4ZWMiIAogICAgZD0iTSAwLDAgTDQsMTQgUTQsMTIgNCwxMyBRMTQsLTE3IDEwLDEgTDE1LDEyIEwxOCwwIEwyMCwyMiBRMTQsMTA1IDE4LDY2IEwxOCw3MiBMMTUsODQgTDEwLDczIFE4LDY3IDQsODUgUTQsODUgNCw4NiBMMCw3MiBMMCw2NiBRLTIsNjEgMiwyMiBMMCwwIFoiIAogICAgaWQ9InJvb3QiPgogIDwvcGF0aD4KCiAgPHVzZSBocmVmPSIjcm9vdCIgeD0iLTE4IiB5PSIwIi8+CiAgPHVzZSBocmVmPSIjcm9vdCIgeD0iMTgiIHk9IjAiLz4KICA8dXNlIGhyZWY9IiNyb290IiB4PSIwIiB5PSI3MiIvPgogIDx1c2UgaHJlZj0iI3Jvb3QiIHg9IjAiIHk9Ii03MiIvPgo8L3N2Zz4=');
background-size: 26px;

SVG Code

<svg 
  xmlns='http://www.w3.org/2000/svg' 
  xmlns:xlink='http://www.w3.org/1999/xlink' 
  width='18' 
  height='72' 
  viewBox='0 0 18 72'
>
  <path 
    stroke="#edb8b1" 
    stroke-width="3"
    fill="#c6e8ec" 
    d="M 0,0 L4,14 Q4,12 4,13 Q14,-17 10,1 L15,12 L18,0 L20,22 Q14,105 18,66 L18,72 L15,84 L10,73 Q8,67 4,85 Q4,85 4,86 L0,72 L0,66 Q-2,61 2,22 L0,0 Z" 
    id="root">
  </path>

  <use href="#root" x="-18" y="0"/>
  <use href="#root" x="18" y="0"/>
  <use href="#root" x="0" y="72"/>
  <use href="#root" x="0" y="-72"/>
</svg>
Download