[CSS]レトロなデザインがいいね！CSSアニメーションで実装されたローディング用のスピナー

画像やJavaScriptは無し、それぞれdivタグ一つとCSSアニメーションで実装されたシンプルでかっこいいローディング用のスピナーを紹介します。

CSS Loading Spinners

スピナーは全部で12種類、レトロ感のあるデザインが素敵ですね。

スピナー1-6

スピナー7-12

実装は、下記ページで確認できます。

CSS Loading Spinners

HTMLはすべて、divタグ一つでシンプルな実装です。
例えば、一つ目の「Circle」はこんな感じ。

HTML

<div class="sp sp-circle"></div>