JSFiddle - React, Tailwind, and code Playground

HTML

<marquee direction="up" behavior="alternate" width="800" height="100" scrollamount="15">
  <hr/>
</marquee>
<marquee direction="down" behavior="alternate" width="800" height="100" scrollamount="10">
  <hr/>
</marquee>
<marquee direction="up" behavior="alternate" width="800" height="100" scrollamount="6">
  <hr/>
</marquee>
<marquee direction="down" behavior="alternate" width="800" height="100" scrollamount="8">
  <hr/>
</marquee>
<marquee direction="up" behavior="alternate" width="800" height="100" scrollamount="11">
  <hr/>
</marquee>

CSS

body {
  background-color: black;
}

marquee {
  position: absolute;
}

hr {
 border: 0;
 height: 1px;
 background: gold;
}