docs/cheese-cat.svg

<svg xmlns="http://www.w3.org/2000/svg" fill="none" overflow="visible"><style>
  @keyframes cat-14-head-move {
  0% {
  transform: translate(0px, -10px);
  }
  50% {
  transform: translate(-0.5px, -10px);
  }
  100% {
  transform: translate(0px, -10px);
  }
  }

  @keyframes cat-14-eyelid-left-move {
  0% {
  height: 1px;
  }
  10% {
  height: 3px;
  }
  20% {
  height: 1px;
  }
  100% {
  height: 1px;
  }
  }

  @keyframes cat-14-eyelid-right-move {
  0% {
  height: 1px;
  }
  10% {
  height: 3px;
  }
  20% {
  height: 1px;
  }
  100% {
  height: 1px;
  }
  }

  @keyframes cat-14-leg-left-move {
  0% {
  transform: translate(4px, 6px);
  }
  50% {
  transform: translate(4px, 7px);
  }
  100% {
  transform: translate(4px, 6px);
  }
  }

  @keyframes cat-14-leg-right-move {
  0% {
  transform: translate(8px, 6px);
  }
  50% {
  transform: translate(8px, 7px);
  }
  100% {
  transform: translate(8px, 6px);
  }
  }

  #cat-14-head {
  animation-name: cat-14-head-move;
  animation-duration: 1s;
  animation-iteration-count: infinite;
  animation-timing-function: ease-in-out;
  }

  #cat-14-eyelid-left {
  animation-name: cat-14-eyelid-left-move;
  animation-duration: 3s;
  animation-iteration-count: infinite;
  animation-timing-function: ease-in-out;
  }

  #cat-14-eyelid-right {
  animation-name: cat-14-eyelid-right-move;
  animation-duration: 3s;
  animation-iteration-count: infinite;
  animation-timing-function: ease-in-out;
  }

  #cat-14-leg-left {
  animation-name:cat-14-leg-left-move;
  animation-duration: 1s;
  animation-iteration-count:infinite;
  animation-timing-function: ease-in-out;
  }

  #cat-14-leg-right {
  animation-name:cat-14-leg-right-move;
  animation-duration:1s;
  animation-delay: 0.5s;
  animation-iteration-count:infinite;
  animation-timing-function: ease-in-out;
  }

</style>
  <g id="cat-14" transform="translate(6, 30)">
    <svg width="600" height="300" viewBox="0 0 200 100" fill="none" overflow="visible">
      <g id="cat-14-shadow" transform="translate(1, 10)">
        <rect y="0.75" width="11" height="1.5" fill="#2B4447" fill-opacity="0.1"/>
        <rect x="0.846146" y="0.375" width="9.30769" height="0.375" fill="#2B4447" fill-opacity="0.1"/>
        <rect x="0.846146" y="2.25" width="9.30769" height="0.375" fill="#2B4447" fill-opacity="0.1"/>
        <rect x="1.69228" width="7.61539" height="0.375" fill="#2B4447" fill-opacity="0.1"/>
        <rect x="1.69228" y="2.625" width="7.61539" height="0.375" fill="#2B4447" fill-opacity="0.1"/>
      </g>

      <g id="cat-14-leg-left" transform="translate(4, 6)">
        <rect width="2" height="5" transform="matrix(-1 0 0 1 2 0)" fill="#FFA917"/>
        <rect width="1" height="5" transform="matrix(-1 0 0 1 1 0)" fill="black" fill-opacity="0.1"/>
      </g>
      <g id="cat-14-leg-right" transform="translate(8, 6)">
        <rect width="2" height="5" transform="matrix(-1 0 0 1 2 0)" fill="#FFA917"/>
        <rect width="1" height="5" transform="matrix(-1 0 0 1 1 0)" fill="black" fill-opacity="0.1"/>
      </g>
      <g id="cat-14-head">
        <rect width="2" height="3" transform="matrix(-1 0 0 1 11 0)" fill="#FFA917"/>
        <rect width="2" height="4" transform="matrix(-1 0 0 1 3 0)" fill="#FFA917"/>
        <rect width="1" height="1" transform="matrix(-1 0 0 1 10 0)" fill="#FFA917"/>
        <rect width="1" height="3" transform="matrix(-1 0 0 1 3 0)" fill="#FFA917"/>
        <rect width="1" height="1" transform="matrix(-1 0 0 1 3 4)" fill="#FFA917"/>
        <rect width="10" height="6" transform="matrix(-1 0 0 1 12 5)" fill="#FFA917"/>
        <rect width="1" height="2" transform="matrix(-1 0 0 1 2 5)" fill="#FFA917"/>
        <rect width="12" height="2" transform="matrix(-1 0 0 1 13 5)" fill="#FFA917"/>
        <rect width="10" height="8" transform="matrix(-1 0 0 1 12 3)" fill="#FFA917"/>
        <rect width="12" height="3" transform="matrix(-1 0 0 1 13 7)" fill="#FFA917"/>
        <rect width="2" height="2" transform="matrix(-1 0 0 1 10 1)" fill="#FFA917"/>
        <rect width="3" height="2" transform="matrix(-1 0 0 1 4 1)" fill="#FFA917"/>
        <rect width="10" height="2" transform="matrix(-1 0 0 1 11 2)" fill="#FFA917"/>
        <rect width="1" height="1" transform="matrix(-1 0 0 1 9 7)" fill="#FEC3CE"/>
        <rect width="2" height="1" transform="matrix(-1 0 0 1 11 8)" fill="#FEFF7D"/>
        <rect width="2" height="1" transform="matrix(-1 0 0 1 8 8)" fill="#FEFF7D"/>
        <rect width="1" height="4" transform="matrix(-1 0 0 1 2 0)" fill="black" fill-opacity="0.1"/>
        <rect width="1" height="1" transform="matrix(-1 0 0 1 3 4)" fill="black" fill-opacity="0.1"/>
        <rect width="1" height="1" transform="matrix(-1 0 0 1 9 3)" fill="black" fill-opacity="0.1"/>
        <rect width="1" height="1" transform="matrix(-1 0 0 1 7 3)" fill="black" fill-opacity="0.1"/>
        <rect width="1" height="1" transform="matrix(-1 0 0 1 9 1)" fill="black" fill-opacity="0.1"/>
        <rect width="1" height="1" transform="matrix(-1 0 0 1 10 0)" fill="black" fill-opacity="0.1"/>
        <rect width="1" height="1" transform="matrix(-1 0 0 1 3 1)" fill="black" fill-opacity="0.1"/>
        <rect width="1" height="2" transform="matrix(-1 0 0 1 2 5)" fill="black" fill-opacity="0.1"/>
        <rect width="1" height="3" transform="matrix(-1 0 0 1 2 7)" fill="black" fill-opacity="0.1"/>
        <rect width="2" height="1" transform="matrix(-1 0 0 1 4 10)" fill="black" fill-opacity="0.1"/>
        <rect width="3" height="1" transform="matrix(-1 0 0 1 9 2)" fill="black" fill-opacity="0.1"/>
        <rect width="1" height="1" transform="matrix(-1 0 0 1 14 7)" fill="#2d2d2d"/>
        <rect width="1" height="1" transform="matrix(-1 0 0 1 14 9)" fill="#2d2d2d"/>
        <rect width="3" height="1" transform="matrix(-1 0 0 1 3 7)" fill="#2d2d2d"/>
        <rect width="3" height="1" transform="matrix(-1 0 0 1 3 9)" fill="#2d2d2d"/>
        <rect width="2.99997" height="4" transform="matrix(-1 0 0 1 12 4)" fill="white"/>
        <rect width="0.272725" height="0.285714" transform="matrix(-1 0 0 1 9.27272 4)" fill="#FFA917"/>
        <rect width="0.272725" height="0.285714" transform="matrix(-1 0 0 1 9.27274 7.71429)" fill="#FFA917"/>
        <rect width="0.272725" height="0.285714" transform="matrix(-1 0 0 1 12 7.71429)" fill="#FFA917"/>
        <rect width="0.272725" height="0.285714" transform="matrix(-1 0 0 1 12 7.42857)" fill="#FFA917"/>
        <rect width="0.272725" height="0.285714" transform="matrix(-1 0 0 1 11.7273 7.71429)" fill="#FFA917"/>
        <rect width="0.272725" height="0.285714" transform="matrix(-1 0 0 1 9.54549 7.71429)" fill="#FFA917"/>
        <rect width="0.272725" height="0.285714" transform="matrix(-1 0 0 1 9.27274 7.42857)" fill="#FFA917"/>
        <rect width="0.272725" height="0.285714" transform="matrix(-1 0 0 1 9.27274 4.28571)" fill="#FFA917"/>
        <rect width="0.272725" height="0.285714" transform="matrix(-1 0 0 1 12 4.28571)" fill="#FFA917"/>
        <rect width="0.272725" height="0.285714" transform="matrix(-1 0 0 1 12 4.57143)" fill="#FFA917"/>
        <rect width="0.272725" height="0.285714" transform="matrix(-1 0 0 1 11.7273 4.28571)" fill="#FFA917"/>
        <rect width="0.272725" height="0.285714" transform="matrix(-1 0 0 1 11.4546 4)" fill="#FFA917"/>
        <rect width="0.272725" height="0.285714" transform="matrix(-1 0 0 1 9.54547 4)" fill="#FFA917"/>
        <rect width="0.272725" height="0.285714" transform="matrix(-1 0 0 1 9.81821 4)" fill="#FFA917"/>
        <rect width="0.272725" height="0.285714" transform="matrix(-1 0 0 1 9.54549 4.28571)" fill="#FFA917"/>
        <rect width="0.272725" height="0.285714" transform="matrix(-1 0 0 1 9.27274 4.57143)" fill="#FFA917"/>
        <rect width="0.272725" height="0.285714" transform="matrix(-1 0 0 1 9.27274 7.14285)" fill="#FFA917"/>
        <rect width="0.272725" height="0.285714" transform="matrix(-1 0 0 1 9.54549 7.42857)" fill="#FFA917"/>
        <rect width="0.272725" height="0.285714" transform="matrix(-1 0 0 1 9.81821 7.71429)" fill="#FFA917"/>
        <rect width="0.272725" height="0.285714" transform="matrix(-1 0 0 1 11.4546 7.71429)" fill="#FFA917"/>
        <rect width="0.272725" height="0.285714" transform="matrix(-1 0 0 1 11.7273 7.42857)" fill="#FFA917"/>
        <rect width="0.272725" height="0.285714" transform="matrix(-1 0 0 1 12 7.14286)" fill="#FFA917"/>
        <rect width="0.272725" height="0.285714" transform="matrix(-1 0 0 1 11.7273 4)" fill="#FFA917"/>
        <rect width="0.272725" height="0.285714" transform="matrix(-1 0 0 1 12 4)" fill="#FFA917"/>
        <rect width="1.36362" height="1.14286" transform="matrix(-1 0 0 1 11.4546 5.42857)" fill="black"/>
        <rect width="0.818175" height="0.571428" transform="matrix(-1 0 0 1 11.1818 6.28571)" fill="black"/>
        <rect width="3" height="2" transform="matrix(-1 0 0 1 12 4)" fill="#FFA917"/>
        <rect width="0.272727" height="0.285714" transform="matrix(-1 0 0 1 9.27272 4.57143)" fill="black" fill-opacity="0.1"/>
        <rect width="0.272727" height="0.285714" transform="matrix(-1 0 0 1 9.54546 4.28571)" fill="black" fill-opacity="0.1"/>
        <rect width="1.90909" height="0.285714" transform="matrix(-1 0 0 1 11.4545 4)" fill="black" fill-opacity="0.1"/>
        <rect width="0.272727" height="0.285714" transform="matrix(-1 0 0 1 11.7273 4.28571)" fill="black" fill-opacity="0.1"/>
        <rect width="0.272727" height="0.285714" transform="matrix(-1 0 0 1 12 4.57143)" fill="black" fill-opacity="0.1"/>
        <rect width="2.99997" height="4" transform="matrix(-1 0 0 1 8 4)" fill="white"/>
        <rect width="0.272725" height="0.285714" transform="matrix(-1 0 0 1 5.27272 4)" fill="#FFA917"/>
        <rect width="0.272725" height="0.285714" transform="matrix(-1 0 0 1 5.27274 7.71429)" fill="#FFA917"/>
        <rect width="0.272725" height="0.285714" transform="matrix(-1 0 0 1 8 7.71429)" fill="#FFA917"/>
        <rect width="0.272725" height="0.285714" transform="matrix(-1 0 0 1 8 7.42857)" fill="#FFA917"/>
        <rect width="0.272725" height="0.285714" transform="matrix(-1 0 0 1 7.72728 7.71429)" fill="#FFA917"/>
        <rect width="0.272725" height="0.285714" transform="matrix(-1 0 0 1 5.54549 7.71429)" fill="#FFA917"/>
        <rect width="0.272725" height="0.285714" transform="matrix(-1 0 0 1 5.27274 7.42857)" fill="#FFA917"/>
        <rect width="0.272725" height="0.285714" transform="matrix(-1 0 0 1 5.27274 4.28571)" fill="#FFA917"/>
        <rect width="0.272725" height="0.285714" transform="matrix(-1 0 0 1 8 4.28571)" fill="#FFA917"/>
        <rect width="0.272725" height="0.285714" transform="matrix(-1 0 0 1 8 4.57143)" fill="#FFA917"/>
        <rect width="0.272725" height="0.285714" transform="matrix(-1 0 0 1 7.72728 4.28571)" fill="#FFA917"/>
        <rect width="0.272725" height="0.285714" transform="matrix(-1 0 0 1 7.45456 4)" fill="#FFA917"/>
        <rect width="0.272725" height="0.285714" transform="matrix(-1 0 0 1 5.54547 4)" fill="#FFA917"/>
        <rect width="0.272725" height="0.285714" transform="matrix(-1 0 0 1 5.81821 4)" fill="#FFA917"/>
        <rect width="0.272725" height="0.285714" transform="matrix(-1 0 0 1 5.54549 4.28571)" fill="#FFA917"/>
        <rect width="0.272725" height="0.285714" transform="matrix(-1 0 0 1 5.27274 4.57143)" fill="#FFA917"/>
        <rect width="0.272725" height="0.285714" transform="matrix(-1 0 0 1 5.27274 7.14285)" fill="#FFA917"/>
        <rect width="0.272725" height="0.285714" transform="matrix(-1 0 0 1 5.54549 7.42857)" fill="#FFA917"/>
        <rect width="0.272725" height="0.285714" transform="matrix(-1 0 0 1 5.81821 7.71429)" fill="#FFA917"/>
        <rect width="0.272725" height="0.285714" transform="matrix(-1 0 0 1 7.45456 7.71429)" fill="#FFA917"/>
        <rect width="0.272725" height="0.285714" transform="matrix(-1 0 0 1 7.72728 7.42857)" fill="#FFA917"/>
        <rect width="0.272725" height="0.285714" transform="matrix(-1 0 0 1 8 7.14286)" fill="#FFA917"/>
        <rect width="0.272725" height="0.285714" transform="matrix(-1 0 0 1 7.72726 4)" fill="#FFA917"/>
        <rect width="0.272725" height="0.285714" transform="matrix(-1 0 0 1 8 4)" fill="#FFA917"/>
        <rect width="1.36362" height="1.14286" transform="matrix(-1 0 0 1 7.45456 5.42857)" fill="black"/>
        <rect width="0.818175" height="0.571428" transform="matrix(-1 0 0 1 7.18181 6.28571)" fill="black"/>
        <rect width="3" height="2" transform="matrix(-1 0 0 1 8 4)" fill="#FFA917"/>
        <rect width="0.272727" height="0.285714" transform="matrix(-1 0 0 1 5.27272 4.57143)" fill="black" fill-opacity="0.1"/>
        <rect width="0.272727" height="0.285714" transform="matrix(-1 0 0 1 5.54546 4.28571)" fill="black" fill-opacity="0.1"/>
        <rect width="1.90909" height="0.285714" transform="matrix(-1 0 0 1 7.45454 4)" fill="black" fill-opacity="0.1"/>
        <rect width="0.272727" height="0.285714" transform="matrix(-1 0 0 1 7.72726 4.28571)" fill="black" fill-opacity="0.1"/>
        <rect width="0.272727" height="0.285714" transform="matrix(-1 0 0 1 8 4.57143)" fill="black" fill-opacity="0.1"/>
        <rect id="cat-14-eyelid-left" width="3" height="1" transform="translate(9, 5)" fill="#FFA917"/>
        <rect id="cat-14-eyelid-right" width="3" height="1" transform="translate(5, 5)" fill="#FFA917"/>
      </g>

      <g id="cat-14-body" transform="translate(1, 0)">
        <rect width="7" height="9" transform="matrix(-1 0 0 1 9 0)" fill="#FFA917"/>
        <rect width="9" height="6" transform="matrix(-1 0 0 1 10 2)" fill="#FFA917"/>
        <rect width="10" height="3" transform="matrix(-1 0 0 1 10 5)" fill="#FFA917"/>
        <rect width="8" height="5" transform="matrix(-1 0 0 1 9 4)" fill="#FFA917"/>
        <rect width="11" height="3" transform="matrix(-1 0 0 1 11 4)" fill="#FFA917"/>
        <rect width="6" height="9" transform="matrix(-1 0 0 1 8 1)" fill="#FFA917"/>
        <rect width="5" height="5" transform="matrix(-1 0 0 1 8 3)" fill="white"/>
        <rect width="3" height="5" transform="matrix(-1 0 0 1 7 2)" fill="white"/>
        <rect width="3" height="1" transform="matrix(-1 0 0 1 8 9)" fill="black" fill-opacity="0.1"/>
        <rect width="2" height="1" transform="matrix(-1 0 0 1 4 9)" fill="black" fill-opacity="0.1"/>
        <rect x="1" y="8" width="1" height="1" fill="black" fill-opacity="0.1"/>
        <rect y="5" width="1" height="1" fill="black" fill-opacity="0.1"/>
        <rect y="4" width="1" height="1" fill="black" fill-opacity="0.1"/>
        <rect x="10" y="6" width="1" height="1" fill="black" fill-opacity="0.1"/>
        <rect width="1" height="2" transform="matrix(-1 0 0 1 3 0)" fill="black" fill-opacity="0.1"/>
        <rect width="1" height="2" transform="matrix(-1 0 0 1 2 2)" fill="black" fill-opacity="0.1"/>
      </g>

      <g id="cat-14-tail" transform="translate(-6, -2)">
        <rect width="2" height="4" transform="matrix(0 1 1 0 6 8)" fill="#FFA917"/>
        <rect width="1" height="3" transform="matrix(0 1 1 0 4 8)" fill="#FFA917"/>
        <rect width="2" height="1" transform="matrix(0 1 1 0 4 7)" fill="#FFA917"/>
        <rect width="1" height="3" transform="matrix(0 1 1 0 2 7)" fill="#FFA917"/>
        <rect width="2" height="1" transform="matrix(0 1 1 0 2 6)" fill="#FFA917"/>
        <rect width="1" height="2" transform="matrix(0 1 1 0 1 6)" fill="#FFA917"/>
        <rect width="3" height="1" transform="matrix(0 1 1 0 1 4)" fill="#FFA917"/>
        <rect width="1" height="2" transform="matrix(0 1 1 0 0 4)" fill="#FFA917"/>
        <rect width="4" height="1" transform="matrix(0 1 1 0 0 1)" fill="#FFA917"/>
        <rect width="1" height="2" transform="matrix(0 1 1 0 0 1)" fill="#FFA917"/>
        <rect width="2" height="1" transform="matrix(0 1 1 0 1 0)" fill="#FFA917"/>
        <rect x="6" y="9" width="2" height="1" fill="black" fill-opacity="0.1"/>
        <rect x="1" width="1" height="2" fill="black" fill-opacity="0.1"/>
        <rect y="1" width="1" height="2" fill="black" fill-opacity="0.1"/>
        <rect x="1" y="4" width="1" height="1" fill="black" fill-opacity="0.1"/>
        <rect x="2" y="6" width="1" height="2" fill="black" fill-opacity="0.1"/>
      </g>
    </svg>
  </g>
</svg>