JSFiddle - React, Tailwind, and code Playground

by deathhell

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/2.0.1/TweenMax.min.js"></script>
<h2 class="title">TweenMax.to() Basic Usage</h2>
<div class="box orange"></div>
<div class="box grey"></div>
<div class="box green"></div>

CSS

body {
  margin:10px;
}

.box {
  display:block;
  width:84px;
  height:84px;
  border-radius: 10px;
}
.orange{
  background: orange;
}
.grey{
  background: gray;
}
.green{
  background :green;
}

JavaScript

TweenMax.to(".green", 3, {rotationX:360});
TweenMax.to(".orange", 3, {rotationY:360});
TweenMax.to(".grey", 3, {x:100, y:100, scale:2, skewX:45, rotation:180});