Чтобы анимация градиента заработала в Safari, необходимо добавить вендорные префиксы для CSS свойств, которые Safari может не поддерживать.
Для того чтобы анимация градиента работала на всех браузерах, включая Safari, можно использовать следующий CSS код:
```
@keyframes gradientAnimation {
0% {
background-position: 0% 50%;
}
50% {
background-position: 100% 50%;
}
100% {
background-position: 0% 50%;
}
}
@-webkit-keyframes gradientAnimation {
0% {
background-position: 0% 50%;
}
50% {
background-position: 100% 50%;
}
100% {
background-position: 0% 50%;
}
}
.gradient-bg {
background: linear-gradient(270deg, #ff00cc, #3333cc);
background-size: 200% 200%;
animation: gradientAnimation 5s ease infinite;
-webkit-animation: gradientAnimation 5s ease infinite;
}
```
Таким образом, вы добавляете вендорные префиксы `-webkit-` для анимаций и убедитесь, что они работают в Safari, а также других браузерах.
Исходный код: [Codepen](https://codepen.io/team/css-tricks/pen/PKGzOo)