on:2022年7月14日sponsors商用プロジェクトでも完全に無料、コピペで簡単に利用できるSVGアニメーションのスピナーを紹介します。見かけるものから変わったものまで、さまざまなスピナーが揃っており、スピナーの素材として重宝すると思います。SVGのスピナーのほとんどは、300-2500バイトの超軽量サイズ。アニメーションも快適で、くるくる気持ちよく動きます。Spinnersは、SVGで実装された超軽量のスピナーです。24x24dpで設計されていますが、SVGなのでサイズやカラーを簡単に変更できます。MITライセンスで、商用プロジェクトでも無料で利用できます。スピナーは44種類あり、その中からいくつかコピペしてみました。見かけるドットが回転するスピナー。6-dots-rotate.svgスピナーを利用するには、svgのコード(下記)をコピペするか、画像のようにimgタグのsrcにファイル名を記述するだけです。repeatCount="indefinite"/></g></svg>バーがフェードしながら回転するのもよく見かけますね。bars-rotate-fade.svgサイズは、200x200にして表示しています。repeatCount="indefinite"/></g></svg>ほかにもよく見かけるスピナーや変わったスピナーが44種類あります。12-dots-scale-rotate.svg12-dots-scale-rotate.svgカラーの変更はCSSで簡単にできます。