Splash screen to play only once

Hi! I'm building up a site with an initial splash screen with a mini logo animation before jumping into the homepage. I've worked out everything except for it to play only once when the user opens the site for the first time. Currently is playing every time I go back to homepage. 

This is the code I used:

<div class="splash-wrapper">

  <img src="https://static1.squarespace.com/static/6356c0bbe92a431593bd2c3c/t/63764a3958e64a4de52927e0/1668696635137/Serendipity+Studios_LogoSHORT.gif" width="500" height="auto"/>

</div>

<style>

.splash-wrapper {

  position: fixed;

  z-index: 9999;

  background-color: #FFFFFF;

  height: 100vh;

  width: 100vw;

  display: flex;

  flex-flow: column nowrap;

  justify-content: center;

  align-items: center;

  animation-name: slideUp;

  animation-fill-mode: forwards;

  animation-duration: 2s;

  animation-delay: 2s;

}

@keyframes slideUp{

  from{transform: translateY(0vh);}

  to{transform: translateY(-100vh);}

}

I would like to understand your problem better. There is an image that animates the letters and there is a css animation that slides up the image from outside the screen to the top of the screen. You want to set up a cookie or localstorage to check if the user already was on the site. If yes just don't show the image, right?

Yes, exactly. I want that initial animation/pre-loader to just play when the user first goes into the site. Once they are in, I don't want it to play anymore. Currently it plays every time I go back to the homepage