JSFiddle - React, Tailwind, and code Playground

HTML

<div></div>

CSS

div {
  height: 1000px;
  position: relative;
  overflow: hidden;
}

div:before {
  content: '';
  display: block;
  position: absolute;
  top: -60px;
  left: 0;
  width: 3px;
  height: calc(100% + 60px);
  background: repeating-linear-gradient(to bottom, rgba(255, 255, 255, 0) 0px, rgba(255, 255, 255, 0) 30px, #007dff 30px, #007dff 60px);
}

div:after {
  content: '';
  display: block;
  position: absolute;
  top: -60px;
  left: 0;
  width: 3px;
  height: 60px;
  background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, #fff 25%, #fff 50%, #fff 75%, rgba(255, 255, 255, 0) 100%);
  box-shadow: 0 0 3px 0 #fff;
  animation: slide 20s infinite linear;
}

@keyframes slide {
    0% { top: -60px; }
    100% { top: calc(100% + 60px); }
}


body {
  margin: 0 30px;
}