on:2022年4月27日sponsorsコピペで簡単に使用できる、HTMLとCSS(複雑なものはSVG)で実装されたWebサイトやスマホアプリ用のローディングアニメーションを紹介します。さまざまなローディングやスピナーが揃っていますが、画像は一切使用されていません。必要な時にさくっと実装できるので、スニペットに登録しておくと便利です。下記は静止画ですが、もちろん全部アニメーションで動きます。-GitHubほかにもCSSで実装されたローディングをチェックしたい人は、下記もどうぞ。Ballのローディングはすべて1Kb未満の超軽量で、依存関係はゼロなので、HTMLとCSSをコピペするだけで簡単に使用できます。カラー・サイズ・アニメーションの速度などはCSSで簡単にカスタマイズできます。MITライセンスで、商用プロジェクトでも無料です。managerが用意されていますが、HTMLとCSSをコピペするだけでも利用できます。いうことで、ローディングをいくつかコピペで実装してみました。ニュートンのゆりかごのローディング。カスタマイズは簡単、カラーと速度を変更してみました。コピペしたHTMLとCSSは、下記の通りです。カラー・サイズ・アニメーションの速度などは、CSSで簡単に変更できます。ease-in;}}実装コードは、各ローディングの「Source」をクリックすると表示されます。Ball他にも気になったローディングをコピペしてみました。