<div class="red"></div>
<div class="orange"></div>
<div class="yellow"></div>
<div class="green"></div>
<div class="blue"></div>
<div class="indigo"></div>
<div class="violet"></div>
body{
  display: flex
}
div{
  height: 3rem;
  width: 3rem;
  border-radius: 100%;
  margin: 2rem
}
.red{
  background-color: red;
}
.orange{
  background-color: orange;
}
.yellow{
  background-color: yellow;
}
.green{
  background-color: green;
}
.blue{
  background-color: blue;
}
.indigo{
  background-color: indigo;
}
.violet{
  background-color: violet;
}
gsap.fromTo('div',{y:500,opacity: 0},{y:200, opacity: 0.5, duration: 2, stagger: 1, ease:"bounce.out"})

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

  1. https://cdn.jsdelivr.net/npm/gsap@3.0.1/dist/gsap.min.js