The latest articles on DEV Community by Ardian Perlaska (@ardianperlaska). https://dev.to/ardianperlaska https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F586380%2F02bfe185-8774-4fe7-8ce0-17293a6d9cdf.png https://dev.to/ardianperlaska en Ardian Perlaska Thu, 25 Feb 2021 20:46:11 +0000 https://dev.to/ardianperlaska/data-loading-animation-hi3 https://dev.to/ardianperlaska/data-loading-animation-hi3 <p>Hi all,</p> <p>I want to share with you a Loading Animation I did for a Data Loading use-case, in the company that I work for.</p> <p>I did this animation roughly 3 years ago, and the reason I want to share is my approach of using SCSS and configurable variables to adjust the speed, colors, and other components.</p> <p>I tried to write self-explanatory code, so it would be easy to extend or have further manipulations there.</p> <p>Feel free to play with it.<br> Any feedback would be appreciated.</p> <p>P.S. The HTML is a bit messy due to SVG's inside. With a bit more effort. All the components would be achievable through CSS.</p> <p><iframe height="600" src="https://codepen.io/ArdianPerlaska/embed/QMggYy?height=600&amp;default-tab=result&amp;embed-version=2"> </iframe> </p> scss html keyframes loading