JSFiddle - React, Tailwind, and code Playground

by Serhii Matrunchyk

HTML

<svg width="30px" height="30px" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
  <g id="logo_segmented" fill="#46A0FC" fill-rule="nonzero">
    <path d="M25.6078218,4.39485149 C21.3181188,0.104376238 14.8660396,-1.17956436 9.26049505,1.14190099 C3.6550099,3.46336634 0,8.9329901 0,15.0000036 C0,21.0670693 3.6550099,26.5366337 9.26055446,28.858099 C14.866099,31.1795644 21.3181188,29.8956238 25.6078218,25.6050891 C31.4640594,19.7476634 31.4640594,10.2523366 25.6078218,4.39491089 L25.6078218,4.39485149 Z M24.744297,24.7578416 C19.3580198,30.1312277 10.6365743,30.1243366 5.25873267,24.7425149 C-0.119049505,19.3606337 -0.119049505,10.6393663 5.25873267,5.25748515 C10.6365149,-0.124336634 19.3580198,-0.131227723 24.744297,5.24215842 C27.336284,7.82794943 28.7929691,11.3387554 28.7929691,15 C28.7929691,18.6612446 27.336284,22.1720506 24.744297,24.7578416 L24.744297,24.7578416 Z" id="outer"></path>
    <path d="M23.2429307,6.70966337 C19.287505,2.74859406 13.0845149,2.13374257 8.42839604,5.24126733 C3.77227723,8.34879208 1.96021782,14.3129703 4.10067327,19.4854455 C6.24106931,24.6579208 11.7376634,27.5976832 17.228198,26.5064554 C22.7186139,25.4152277 26.6733861,20.5970495 26.6732673,14.9992277 C26.6731707,11.8907247 25.4394165,8.90932295 23.2429307,6.70972277 L23.2429307,6.70966337 Z M22.3985941,22.436198 C18.8506337,25.9948515 13.2826931,26.5508317 9.10116832,23.7639802 C4.91964356,20.9771287 3.28984158,15.6241188 5.20889109,10.9799406 C7.12794059,6.33564356 12.0610099,3.69445545 16.990099,4.67221782 C21.9191287,5.6499802 25.4705941,9.97419802 25.4716634,14.9992277 C25.4722419,17.7873091 24.3671,20.4618252 22.3985941,22.4362574 L22.3985941,22.436198 Z" id="inner"></path>
    <path d="M14.970297,16.8712871 C13.9532182,16.8712871 13.1287129,16.0467818 13.1287129,15.029703 C13.1287129,14.0126241 13.9532182,13.1881188 14.970297,13.1881188 C15.9873759,13.1881188 16.8118812,14.0126241 16.8118812,15.029703 C16.8118812,16.0467818...

CSS

#short_arrow {
  animation: clocks 70s infinite linear;
  transform-origin: center;
}

#long_arrow {
  animation: clocks 7s infinite linear;
  transform-origin: center;
}


@keyframes clocks {
	0% {
	  transform: rotate(0deg);
  }

  100% {
	  transform: rotate(360deg);
  }
}