@keyframes anim {
  
  from {
    background: yellow;
    offset-distance: 0%;
  }
  
  60% {
    background: white;
    offset-distance: 30%;
  }
  
  to {
    background: green;
    offset-distance: 100%;
  }
  
}

div {
  width: 100px;
  height: 100px;
  position: relative;
  background: yellow;
  offset: path("M 100 100 L 300 100 L 200 300 z") reverse 60deg;
  offset-anchor: right bottom;
  animation: anim 2s 0s alternate infinite;
}