Hello,
Since Hype does not support flexible gradient Font natively, so I am following this generator at https://www.gradient-animator.com/
and use this css code:
.css-selector {
background: linear-gradient(270deg, #ff0000, #ffb60d, #f2ff00, #00ff1c, #00fff1, #0042ff, #ff00cd);
background-size: 1400% 1400%;
-webkit-animation: AnimationName 30s ease infinite;
-moz-animation: AnimationName 30s ease infinite;
-o-animation: AnimationName 30s ease infinite;
animation: AnimationName 30s ease infinite;
}
@-webkit-keyframes AnimationName {
0%{background-position:0% 50%}
50%{background-position:100% 50%}
100%{background-position:0% 50%}
}
@-moz-keyframes AnimationName {
0%{background-position:0% 50%}
50%{background-position:100% 50%}
100%{background-position:0% 50%}
}
@-o-keyframes AnimationName {
0%{background-position:0% 50%}
50%{background-position:100% 50%}
100%{background-position:0% 50%}
}
@keyframes AnimationName {
0%{background-position:0% 50%}
50%{background-position:100% 50%}
100%{background-position:0% 50%}
}
In Hype, I set CSS on the font:
earth_animation_byCSS copy 2.hype.zip (35.7 KB)
and the color on font works, but animation does not work, anyone would like to let me know what did I missed please?
Thanks so much.