JSFiddle - React, Tailwind, and code Playground

by leongaban

HTML

<div id="arrow_container">
    <img class="animate_arrow" src="https://whoat.net/assets/img/dashboard/acct_fake_arrow.png" alt=""/>
</div>

CSS

#arrow_container{
    margin: 50px;
}

@keyframes upDown {
    from { top: 8px; } 
    to   { top:-18px; }
}
@-moz-keyframes upDown {
    from { top: 8px; } 
    to   { top:-18px; }
}
@-webkit-keyframes upDown {
    from { top: 8px; } 
    to   { top:-18px; }
}

.animate_arrow {
    position: relative;
    top: 8px;
    animation: upDown 1.5s linear infinite;
	-moz-animation: upDown 1.5s infinite linear;
	-webkit-animation: upDown 1.5s infinite linear;
}