← All elements
<div class="pp"><i></i></div>About this animation
A paper plane drawn with a clip-path glides across a dotted trail, then loops, as a send or upload indicator.
How it works
A clip-path polygon forms the plane. One keyframe moves it along the dotted line with changes in rotation and a fade at both ends, so it takes off, cruises and disappears before looping.
Ways to customise it
- Change the plane colours.
- Edit the translate distances.
- Switch the dotted line colour.
Good to know
It is decorative and static under reduced motion. Use a text status for a real send action.
Open an example, copy the HTML and the CSS, and paste them into your page. There is nothing to install and no JavaScript to load.