index.html

<!DOCTYPE html>
<html lang="en">
<head>
    <!-- Google tag (gtag.js) -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-7CHREE5FTX"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());
  gtag('config', 'G-7CHREE5FTX');
</script>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/1.2.0/p5.min.js"></script>
    <script src="sketch.js"></script>
    <style>
        #canvas{
            border: solid rgb(255, 255, 255);
            height: 500px;
            width: 500px;
            margin: auto;
        }
        body{
            background-color: blueviolet;
        }
        h1{
            text-align: center;
            font-weight: 1000;
            color: azure;
            font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
        }
        span{
            color: black;
            font-family: 'Courier New', Courier, monospace;
            font-weight: 700;
        }
    </style>
    <title>The Game of Life</title>
</head>
<body>
    <h1>The Game Of Life</h1>
    <div id="data">
    <span id="gen-num"></span>
    </div>
    <br>
    <div id="canvas"></div>
</body>
</html>