So I wanted to insert a custom font to HTML and I can't quite figure it out. I tried doing this code down below but it did not work.

Here is the file for the font I am trying to use. https://drive.google.com/drive/folders/1C_2kPmCHj60KyFKcxYiGuOkRO8p820Yt?usp=sharing

Code

  <head>
    <div class = "center">
      <h1 style = "font-face: myFirstFont">
        Hi
      </h1>
    </div>
    <style>
      div.center {
        text-align: center;
      }
      @font-face {
   font-family: myFirstFont;
   src: url(candyshopregular-nobo-webfont.woff2);
        }
    </style>
  </head>
</html>