<div class="swipe-icon">
  <svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
	 viewBox="0 0 512 512" style="enable-background:new 0 0 512 512;" xml:space="preserve">
			<path fill="currentColor" d="M432.772,384h-88.917c-5.354,0-8.125-3.531-9.063-5.052s-2.875-5.583-0.479-10.385L464.731,107.74
				c3-6.021,4.604-12.771,4.604-21.448c0-24.052-19.563-43.625-43.625-43.625c-16.625,0-31.583,9.24-39.021,24.115l-66.708,133.417
				c-11.313-20.771-34.708-32.448-58.417-28.875l-113.375,17.448c-17.083,2.625-31.896,13.417-39.604,28.865L51.71,331.406
				c-5.917,11.823-9.042,25.063-9.042,38.281c0,32.635,18.125,61.969,47.313,76.563l100.271,50.135
				C210.689,506.604,233.564,512,256.397,512c14.979,0,29.813-2.271,44.104-6.74l150.688-47.083c2.75-0.865,5.063-2.813,6.354-5.406
				l7.938-15.875c2.521-5.052,3.854-10.708,3.854-16.344C469.335,400.396,452.939,384,432.772,384z M446.397,427.365l-5.896,11.802
				l-146.375,45.74c-30.896,9.635-65.396,6.854-94.333-7.604L99.522,427.167c-21.917-10.958-35.521-32.979-35.521-57.479
				c0-9.927,2.354-19.865,6.792-28.74l56.875-113.771c4.625-9.271,13.521-15.75,23.771-17.323l113.375-17.448
				c15.146-2.281,30.229,5.5,37.042,19.167l8.604,17.198c3.625,7.229,15.458,7.229,19.083,0l76.229-152.448
				C409.564,68.719,417.21,64,425.71,64c12.292,0,22.292,10,22.292,24.219c0,3.448-0.813,6.896-2.354,9.969L315.231,359.031
				c-5,9.99-4.458,21.635,1.417,31.135s16.042,15.167,27.208,15.167h88.917c8.396,0,15.229,6.823,15.229,15.219
				C448.001,422.906,447.439,425.26,446.397,427.365z"/>
			<path fill="currentColor"  d="M53.335,128.469c0.875,0,1.771-0.104,2.646-0.333l85.333-21.802c3.479-0.896,6.292-3.49,7.458-6.906
				c1.146-3.417,0.5-7.188-1.729-10.021l-22.042-28.052c38.208-25.74,83.646-40.021,131-40.021c37.708,0,73.708,8.667,107,25.76
				c5.208,2.667,11.688,0.646,14.354-4.615c2.708-5.24,0.625-11.677-4.604-14.365C336.918,9.719,296.543,0,256.001,0
				c-55.562,0-108.75,18.031-152.25,50.25c-0.229,0.156-0.458,0.313-0.688,0.49c-0.063,0.052-0.125,0.104-0.188,0.156
				c-22.354,16.708-42.146,37.177-58.354,60.885c-2.5,3.667-2.479,8.5,0.083,12.135C46.626,126.813,49.918,128.469,53.335,128.469z
				 M107.856,74.073l12.313,15.646l-39.167,10C89.314,90.427,98.293,81.854,107.856,74.073z"/>
		
</svg>
</div>
/* just presentation */
body, html {  height:100vh; padding:0; margin:0; }
body { display: flex; justify-content: center; align-items:center; background: red }

/* here we are */
.swipe-icon {
  width: 50px;
  height: auto;
  color: white;
  animation : swipefloating;
  animation-duration: 1s;
  animation-iteration-count: infinite;
}

@keyframes swipefloating {
  0% {
    transform: translateX(20px) rotate(0deg);
  }
  50% {
    transform: translateX(-20px) rotate(-40deg);
  }
  100% {
    transform: translateX(20px) rotate(0deg);
  }
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.