<div class="box rotate"></div>
html,body {
  display: grid;
  justify-items: center;
  align-content: center;
  
  width: 100%;
  height: 100%;
  background-color: #eaeaea;
}

.box {
  width: 100px;
  height: 100px;
  background-color: indianred;
}

.rotate {
  animation-name: rotate;
  animation-duration: 1s;
}

@keyframes rotate {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.