.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%; }