JSFiddle - React, Tailwind, and code Playground

by Glynne Turner

HTML

<html>
  
  <body>
    
    <div id="container">
      <p>Random Colour<br/>  </p>
    </div>
    
  </body>
  
</html>

CSS

body { 
  transition: 2s;
}

#container {
  text-align: center;
  color: #ffffff;
  font-family: arial, helvetica, sans-serif;
  font-weight: bolder;
  font-size: 120px;
  text-transform: uppercase;
  transition: .7s;
  text-shadow:2px 2px 4px #666666
}

JavaScript

function randomColor(){
 var randomColor = '#'+ ('000000' + Math.floor(Math.random()*16777215).toString(16)).slice(-6);    
    $('body').css({'background-color' : randomColor,}); 
}  
$(window).ready(function() { randomColor()});
$(document).click(function(){ randomColor()});