JSFiddle - React, Tailwind, and code Playground

HTML

<!DOCTYPE html>
<html lang="en">
    <head>
        <title>css-transition-text</title>
    </head> 
    <body>
        <h1>Wickedly Awesome Header</h1>
        <p>Slightly less but still reasonably awesome paragraph</p>
    </body>
</html>

CSS

h1
{
    font-size: 2em;
    position: absolute;
    top: 10px;
    left: 50px;
    
  -
    
    -webkit-transform: scale(1.0) rotate(3deg);
        -ms-transform: scale(1.0) rotate(3deg);
       -moz-transform: scale(1.0) rotate(3deg);
         -o-transform: scale(1.0) rotate(3deg);
            transform: scale(1.0) rotate(3deg);

  
}

h1:hover
{
    -webkit-transform: scale(1.2);
        -ms-transform: scale(1.2);
       -moz-transform: scale(1.2);
         -o-transform: scale(1.2);
            transform: scale(1.2);

   
}

p { margin-top: 60px; } /* Just getting this out of the way */