.wrapper{-webkit-user-select:none;user-select:none;background-color:#0000;border:none;width:200px;height:200px;margin:-100px;position:absolute;top:50%;left:50%}.wrapper .box-wrap{width:70%;height:70%;margin:15%;position:relative;transform:rotate(-45deg)}.wrapper .box-wrap .box{visibility:hidden;background:linear-gradient(90deg,#141562,#486fbc,#eab5a1,#8dd6ff,#4973c9,#d07ca7,#f4915e,#f5919e,#b46f89,#141562,#486fbc) 0%/1000% 1000%;width:100%;height:100%;position:absolute;top:0;left:0}.wrapper .box-wrap .box.one{animation:15s infinite moveGradient,3.5s infinite oneMove}.wrapper .box-wrap .box.two{animation:15s infinite moveGradient,3.5s .15s infinite twoMove}.wrapper .box-wrap .box.three{animation:15s infinite moveGradient,3.5s .3s infinite threeMove}.wrapper .box-wrap .box.four{animation:15s infinite moveGradient,3.5s .575s infinite fourMove}.wrapper .box-wrap .box.five{animation:15s infinite moveGradient,3.5s .725s infinite fiveMove}.wrapper .box-wrap .box.six{animation:15s infinite moveGradient,3.5s .875s infinite sixMove}@keyframes moveGradient{to{background-position:100%}}@keyframes oneMove{0%{visibility:visible;clip-path:inset(0% 35% 70% round 5%);animation-timing-function:cubic-bezier(.86,0,.07,1)}14.2857%{clip-path:inset(0% 35% 70% round 5%);animation-timing-function:cubic-bezier(.86,0,.07,1)}28.5714%{clip-path:inset(35% round 5%);animation-timing-function:cubic-bezier(.86,0,.07,1)}42.8571%{clip-path:inset(35% 70% 35% 0 round 5%);animation-timing-function:cubic-bezier(.86,0,.07,1)}57.1428%{clip-path:inset(35% 70% 35% 0 round 5%);animation-timing-function:cubic-bezier(.86,0,.07,1)}71.4285%{clip-path:inset(0% 70% 70% 0 round 5%);animation-timing-function:cubic-bezier(.86,0,.07,1)}85.7142%{clip-path:inset(0% 70% 70% 0 round 5%);animation-timing-function:cubic-bezier(.86,0,.07,1)}to{clip-path:inset(0% 35% 70% round 5%);animation-timing-function:cubic-bezier(.86,0,.07,1)}}@keyframes twoMove{0%{visibility:visible;clip-path:inset(0% 70% 70% 0 round 5%);animation-timing-function:cubic-bezier(.86,0,.07,1)}14.2857%{clip-path:inset(0% 70% 70% 0 round 5%);animation-timing-function:cubic-bezier(.86,0,.07,1)}28.5714%{clip-path:inset(0% 35% 70% round 5%);animation-timing-function:cubic-bezier(.86,0,.07,1)}42.8571%{clip-path:inset(0% 35% 70% round 5%);animation-timing-function:cubic-bezier(.86,0,.07,1)}57.1428%{clip-path:inset(35% round 5%);animation-timing-function:cubic-bezier(.86,0,.07,1)}71.4285%{clip-path:inset(35% 70% 35% 0 round 5%);animation-timing-function:cubic-bezier(.86,0,.07,1)}85.7142%{clip-path:inset(35% 70% 35% 0 round 5%);animation-timing-function:cubic-bezier(.86,0,.07,1)}to{clip-path:inset(0% 70% 70% 0 round 5%);animation-timing-function:cubic-bezier(.86,0,.07,1)}}@keyframes threeMove{0%{visibility:visible;clip-path:inset(35% 70% 35% 0 round 5%);animation-timing-function:cubic-bezier(.86,0,.07,1)}14.2857%{clip-path:inset(35% 70% 35% 0 round 5%);animation-timing-function:cubic-bezier(.86,0,.07,1)}28.5714%{clip-path:inset(0% 70% 70% 0 round 5%);animation-timing-function:cubic-bezier(.86,0,.07,1)}42.8571%{clip-path:inset(0% 70% 70% 0 round 5%);animation-timing-function:cubic-bezier(.86,0,.07,1)}57.1428%{clip-path:inset(0% 35% 70% round 5%);animation-timing-function:cubic-bezier(.86,0,.07,1)}71.4285%{clip-path:inset(0% 35% 70% round 5%);animation-timing-function:cubic-bezier(.86,0,.07,1)}85.7142%{clip-path:inset(35% round 5%);animation-timing-function:cubic-bezier(.86,0,.07,1)}to{clip-path:inset(35% 70% 35% 0 round 5%);animation-timing-function:cubic-bezier(.86,0,.07,1)}}@keyframes fourMove{0%{visibility:visible;clip-path:inset(35% 0% 35% 70% round 5%);animation-timing-function:cubic-bezier(.86,0,.07,1)}14.2857%{clip-path:inset(35% 0% 35% 70% round 5%);animation-timing-function:cubic-bezier(.86,0,.07,1)}28.5714%{clip-path:inset(35% round 5%);animation-timing-function:cubic-bezier(.86,0,.07,1)}42.8571%{clip-path:inset(70% 35% 0% round 5%);animation-timing-function:cubic-bezier(.86,0,.07,1)}57.1428%{clip-path:inset(70% 35% 0% round 5%);animation-timing-function:cubic-bezier(.86,0,.07,1)}71.4285%{clip-path:inset(70% 0 0 70% round 5%);animation-timing-function:cubic-bezier(.86,0,.07,1)}85.7142%{clip-path:inset(70% 0 0 70% round 5%);animation-timing-function:cubic-bezier(.86,0,.07,1)}to{clip-path:inset(35% 0% 35% 70% round 5%);animation-timing-function:cubic-bezier(.86,0,.07,1)}}@keyframes fiveMove{0%{visibility:visible;clip-path:inset(70% 0 0 70% round 5%);animation-timing-function:cubic-bezier(.86,0,.07,1)}14.2857%{clip-path:inset(70% 0 0 70% round 5%);animation-timing-function:cubic-bezier(.86,0,.07,1)}28.5714%{clip-path:inset(35% 0% 35% 70% round 5%);animation-timing-function:cubic-bezier(.86,0,.07,1)}42.8571%{clip-path:inset(35% 0% 35% 70% round 5%);animation-timing-function:cubic-bezier(.86,0,.07,1)}57.1428%{clip-path:inset(35% round 5%);animation-timing-function:cubic-bezier(.86,0,.07,1)}71.4285%{clip-path:inset(70% 35% 0% round 5%);animation-timing-function:cubic-bezier(.86,0,.07,1)}85.7142%{clip-path:inset(70% 35% 0% round 5%);animation-timing-function:cubic-bezier(.86,0,.07,1)}to{clip-path:inset(70% 0 0 70% round 5%);animation-timing-function:cubic-bezier(.86,0,.07,1)}}@keyframes sixMove{0%{visibility:visible;clip-path:inset(70% 35% 0% round 5%);animation-timing-function:cubic-bezier(.86,0,.07,1)}14.2857%{clip-path:inset(70% 35% 0% round 5%);animation-timing-function:cubic-bezier(.86,0,.07,1)}28.5714%{clip-path:inset(70% 0 0 70% round 5%);animation-timing-function:cubic-bezier(.86,0,.07,1)}42.8571%{clip-path:inset(70% 0 0 70% round 5%);animation-timing-function:cubic-bezier(.86,0,.07,1)}57.1428%{clip-path:inset(35% 0% 35% 70% round 5%);animation-timing-function:cubic-bezier(.86,0,.07,1)}71.4285%{clip-path:inset(35% 0% 35% 70% round 5%);animation-timing-function:cubic-bezier(.86,0,.07,1)}85.7142%{clip-path:inset(35% round 5%);animation-timing-function:cubic-bezier(.86,0,.07,1)}to{clip-path:inset(70% 35% 0% round 5%);animation-timing-function:cubic-bezier(.86,0,.07,1)}}