[Script] Rainbow Effect Box

test

 

[Script]Rainbow Text
[Script]FLOATING LOVE HEARTS

 

@-webkit-keyframes spark {
  from {
    background-position: 0% 100%;
  }
  to {
    background-position: 200% 100%;
  }
}

@keyframes spark {
  from {
    background-position: 0% 100%;
  }
  to {
    background-position: 200% 100%;
  }
}
.reb {
  background: white;
  display: inline-block;
  padding: 1em;
  font-family: Helvetica Neue;
  border-radius: 4px;
  position: relative;
}
.reb:before {
  -webkit-animation: spark 4s infinite linear;
          animation: spark 4s infinite linear;
  background: -webkit-gradient(linear, left top, right top, from(#7FEFBD), color-stop(11%, #FFF689), color-stop(22%, #EC0B43), color-stop(33%, #7FEFBD), color-stop(44%, #FFF689), color-stop(55%, #EC0B43), color-stop(66%, #7FEFBD), color-stop(77%, #FFF689), color-stop(88%, #EC0B43), to(#7FEFBD));
  background: linear-gradient(90deg, #7FEFBD 0%, #FFF689 11%, #EC0B43 22%, #7FEFBD 33%, #FFF689 44%, #EC0B43 55%, #7FEFBD 66%, #FFF689 77%, #EC0B43 88%, #7FEFBD 100%);
  background-size: 200% 100%;
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  border-radius: 4px;
  -webkit-filter: blur(3px);
          filter: blur(3px);
  z-index: -1;
  -webkit-transform: scale(0.99) translateY(3px);
          transform: scale(0.99) translateY(3px);
}​