Trippy CSS animation

trippy.css

.trippy {
    animation-name: animate-trippy;
    animation-duration: 1s;
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite;
    animation-direction: alternate
}

@keyframes animate-trippy {
    0% {
        filter: hue-rotate(0deg) saturate(10);
    }
    100% {
        filter: hue-rotate(360deg) saturate(10);
    }
}

In action here: https://codepen.io/drewnoakes/pen/XeMObg