how to start css animation on hover code example

Example 1: css start animation on hover

button{
  animation: rotate360 1.2s linear infinite;  /* animation set */
  animation-play-state: paused;               /* put paused */
}
button:hover{
  animation-play-state: running;              /* trigger on hover */
}
@keyframes rotate360 {                        /* keyframes of animation */
  to { transform: rotate(360deg); }           
}

Example 2: css hover animation

.YOURHTMLCONTENT i {
    height: auto;
    float: left;
    color: #fff;
    font-size: 55px;
    margin: 30px 30px 30px 30px;
    transition: 0.8s;
    transition-property: color, transform;
}

.YOURHTMLCONTENT i:hover {
    color: #FF5733;
    transform: scale(1.3);
}