<!-- No HTML markup needed-->
<center>Made by Simon Köhler / <a href="https://simon-koehler.com/en" target="_blank">simon-koehler.com</a></center>
html,body{
  height:100%;
  width:100%;
  overflow:hidden;
}

body{
  background-image: url(https://i.imgur.com/JocyXBD.jpg);
  background-size: cover;
  background-position: center center;
  position: relative;
  center{
    font-size:14px;
    position: absolute;
    bottom:20px;
    color:#fff;
    a{
      color:steelblue;
    }
  }
}

i{
  width: 10px;
  height: 10px;
  background-color: #fff;
  border-radius: 50%;
  box-shadow: 0 0 10px 4px rgba(white,0.8);
  position: absolute;
  transition: all 0.4s ease-in-out;
  transform: rotate(15deg);
  animation: shine;
  animation-duration: 5s;
  animation-iteration-count: infinite;
  &:after,
  &:before{
    content: "";
    display: block;
    position: absolute;
    background-image:linear-gradient(to left, transparent, white, transparent);
    left: -34px;
    top: calc(50% - 1px);
    width: 80px;
    height: 2px;
  }
  &:before{
    width: 2px;
    height: 80px;
    left: calc(50% - 1px);
    top: -34px;
    background-image:linear-gradient(to bottom, transparent, white, transparent);
  }
}

@keyframes shine{
  
  0%{
      transform: scale(0.1) rotate(-200deg);
  }
  55%{
      transform: scale(1.2) rotate(180deg);
  }
  100%{
      transform: scale(0.1) rotate(-200deg);
  }
  
}
View Compiled
document.addEventListener("DOMContentLoaded", function() {
   
  var amount = 30;
  var body = document.querySelector('body');
  var i = 0;
  
  while (i < amount) {
    var node = document.createElement("i");
    var posX = Math.floor(Math.random() * window.innerWidth);
    var posY = Math.floor(Math.random() * window.innerHeight);
    var rotation = Math.random() * 180;
    var delay = Math.random() * 20;
    var scale = Math.random() * 0.2;
    node.style.left = posX+'px';
    node.style.top = posY+'px';
    node.style.transform = 'rotate('+rotation+'deg) scale('+scale+')';
    node.style.animationDelay = delay+'s';
    body.appendChild(node);
    i++;
  }
  
});

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.