Get CSS Loading Animations from


Whenever we add any kind of AJAX request on page, we also add a gif animation to show that your request has been processed. Most of us use loading bar or loading circle like animated GIF images. Do you know that you can add the same kind of animation effect with CSS. By manipulating HTML objects only with CSS you get similar kind of animation effect as you get with GIF. If you are not expert in CSS or do not have any idea of how to get this, you can use This is an awesome website to get CSS code snippets of various loading animation.

Visit and select the loading animation from the dropdown just below the logo. Then select the colors, width, height and speed of animation from top tool bar.

Loading animation with CSS

You can also reverse the animation if you want. When you done with customization, click on “Get Code” button. It will generate the CSS code. Just place this code on your website to get CSS animation effect.

CSS Loading Animations

CSS animation is not a new thing. It was added back in 2007 when webkit decided to add animation and transformation. This is supported by most of the latest browser. You can see the list of all supported web browsers here.

This is really a cool website to get animation codes. You can also use this website to know how to create different kind of animation with CSS and then modify the code to create your own animation. Code and learn 😀

Tags: |

Deepanker Verma is the founder of Techlomedia. He is a tech blogger, developer and gadget freak.

Similar Articles


Leave a comment

Comment policy: We love comments and appreciate the time that readers spend to share ideas and give feedback. However, all comments are manually moderated and those deemed to be spam or solely promotional will be deleted.

2020 UseThisTip | Part of Techlomedia Internet Pvt Ltd Developed By Deepanker