Try it Live

​x
 
<!DOCTYPE html>
<html>
  <head>
    <style> 
     .three-d-animation {
      width: 100px;
      height:100px;
      margin-left;
      border:6px dotted black;
      padding:5px;
      background-color: #33CBCC;
      text-align:center;
      border-radius:50%;
      transition:transform 3s linear;
     }
      
     .three-d-animation:hover {
       transform: rotate3d(2, 2, 2, 260deg); 
       -webkit-transform: rotate3d(2, 2, 2, 260deg); /*Safari and Chrome*/
     }
    </style>
  </head>
  <body>
    <h3> Example for 3D Animation</h3>
    <div class="three-d-animation"></div>
  </body>
</html>
​