Pattern Generator

Options

CSS output

.bg {
  position:relative;
  overflow:hidden;
}
.bg::before,
.bg::after {
  content: '';
  position: absolute;
  inset:0;
  width:10000px;
  background-image: repeating-linear-gradient(45deg, rgb(89, 242, 13) 30px, rgb(89, 242, 13) 60px, rgb(133, 110, 247) 60px, rgb(133, 110, 247) 90px, rgb(122, 31, 107) 90px, rgb(122, 31, 107) 120px);
  background-size: 100px 100%;
}

.bg::after {
  transform:scaleX(-1);
  -webkit-mask: linear-gradient(90deg,#000 50%, #0000 0) 0/100px 100%;
          mask: linear-gradient(90deg,#000 50%, #0000 0) 0/100px 100%;
}