<h1 data-text="ABC"></h1>
h1 {
  position: relative;
  font-size: 10em;
  letter-spacing:10px;
  font-family: sans-serif;
  display:table;
  margin:40px auto;
  cursor:pointer;
  transition:.6s;
}
h1:before,
h1:after {
  content:attr(data-text);
  transition:.6s;
}
h1:before {
  left: 0;
  top: 0;
  position: absolute;
  z-index:-1;
  text-shadow:
   0px 0px,
   0px 0px,
   0px 0px,
   0px 0px,
   0px 0px,
   0px 0px,
   0px 0px,
   0px 0px,
   0px 0px,
   0px 0px;
  -webkit-mask:repeating-linear-gradient(45deg, transparent 0 3px, rgba(0,0,0,0.5) 0 6px);
          mask:repeating-linear-gradient(45deg, transparent 0 3px, rgba(0,0,0,0.5) 0 6px);
}
h1:hover {
  transform:translate(-10px,-10px);
}  
h1:hover:before {
  text-shadow:
   1px 1px,
   2px 2px,
   3px 3px,
   4px 4px,
   5px 5px,
   6px 6px,
   7px 7px,
   8px 8px,
   9px 9px,
   10px 10px;
}

body {
  background:pink;
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.