Ripple
Expands outward from the centre while fading — a water ripple.
Preview
Tune parameters
Full code
/* Ripple */
@keyframes ripple {
from { opacity: .7; transform: scale(.4); }
to { opacity: 0; transform: scale(2); }
}
.ripple { animation: ripple 1.8s ease-out infinite; }