When you use the full potential of CSS you can create amazing animations for your website. but the problem is how. I have a shortcode for beginners that I want to show you so that you can give a lively touch to your titles and be able to demonstrate greater design potential.
Set the CSS Class
Add the name what you want in the class of the element <a> in the HTML code.
Set the style
In this step, we go to CSS file to set the animation with 3 seconds, the infinite loop, the transition with 0.7 seconds for all and the link style
Set the hover action
We set the size bigger in the hover action, the hover action is activated when the cursor hover the element.
Set the animation keyframes
Keyframes are used to set rule specifies for the animations, with these rules we can make awesome animations, in this case, we make a multicolored animation on the 3 seconds that we had configured before.
The use of keyframes for our website is the best practice to make animations on professional websites. Thanks to these animations we can capture the attention of the user and offer a better experience.
Thanks for seeing my post good coding!!
Link CodePen: https://codepen.io/iivancabral/pen/jOEEMzL