JSFiddle - React, Tailwind, and code Playground

by Josephthecoolestguy69

HTML

<div class="space stars1"></div>
<div class="space stars2"></div>
<div class="space stars3"></div>

  <link href="https://fonts.googleapis.com/css2?family=Orbitron:wght@500;700&display=swap" rel="stylesheet">

  PROTECT MARS

  <link href="https://fonts.googleapis.com/css2?family=Orbitron:wght@500;700&display=swap" rel="stylesheet">

  <p> PROTECT MARS FROM THE EVIL  FORCE AND LEARN THE TRUTH OF RED PLANET. BE THE ASTRONAUT YOU WANT TO BE GO ON A PERILOUS JOURNEY TO A FAR AWAY LAND.</p>
  <P>BY JOSEPH SANSOSTI, JAY PATEL, AND VIVAAN SHARMA.</P>
   
  <p1 style=" font-size: 10px; ">Game fully created in Unity Game Studio.</p1>

<p>WASD to move</p>
<p>Shift to dash</p>
<p>Click to shoot.</p>
<p>Collect health (hearts)</p>
<p>choose your character from home.</p>

CSS

body {
  height: 100vh;
  overflow: hidden;
}
body {
  background: radial-gradient(circle at bottom, rgb(106, 13, 153) 0, black 100%);
  height: 100vh;
  overflow: hidden;
}
.space {
  bottom: 0;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
}
.space {
  background: rgba(128, 0, 128, 0.1) center / 200px 200px round;
  bottom: 0;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
}
.space {
  background: rgba(128, 0, 128, 0.1) center / 200px 200px round;
  border: 1px dashed purple;
  bottom: 0;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
}
.stars1 {
  background-image:
    radial-gradient(
      1px 1px at 25px 5px, 
      white, 
      rgba(255, 255, 255, 0)
    ),
    radial-gradient(
      1px 1px at 50px 25px, 
      white, 
      rgba(255, 255, 255, 0)
    ),
    radial-gradient(
      1px 1px at 125px 20px, 
      white, 
      rgba(255, 255, 255, 0)
    ),
    radial-gradient(
      1.5px 1.5px at 50px 75px, 
      white, 
      rgba(255, 255, 255, 0)
    ),
    radial-gradient(
      2px 2px at 15px 125px, 
      white, 
      rgba(255, 255, 255, 0)
    ),
    radial-gradient(
      2.5px 2.5px at 110px 80px, 
      white, 
      rgba(255, 255, 255, 0)
    );
}
.stars2 {
  background-image:
    radial-gradient(
      1px 1px at 75px 125px, 
      white, 
      rgba(255, 255, 255, 0)
    ),
    radial-gradient(
      1px 1px at 100px 75px, 
      white, 
      rgba(255, 255, 255, 0)
    ),
    radial-gradient(
      1.5px 1.5px at 199px 100px, 
      white, 
      rgba(255, 255, 255, 0)
    ),
    radial-gradient(
      2px 2px at 20px 50px, 
      white, 
      rgba(255, 255, 255, 0)
    ),
    radial-gradient(
      2.5px 2.5px at 100px 5px, 
      white, 
      rgba(255, 255, 255, 0)
    ),
    radial-gradient(
      2.5px 2.5px at 5px 5px, 
      white, 
      rgba(255, 255, 255, 0)
    ); 
}
.stars3 {
  background-image:
   ...