みなさんこんにちは!おさかなです!
今回は「CSS loaders and Spinners」について、書いていこうと思います!
それでは、レッツゴー!!!!!
・読み込み中のデザインを探している方
・ローディングアイコンを探している方
・HTML/CSSを学習中の方
「読み込み中」のデザインが決まらない!

読み込み中のデザイン、どんな風にしたらいいか決まらない💦

それじゃあ「
CSS loaders and Spinners」を参考にしてみたら?

おお!なんか凄そう!
https://osakanav.com/nomad-code
「CSS loaders and Spinners」って何?
「CSS loaders and Spinners」とは、Webサイトの読み込み中に表示される、ぐるぐる回る「ローディング」アニメーションのデザインを探せるサイトことです。
HTML/CSSコードを「コピペ」するだけで、デザインを実装でき、CSSを変更してカスタマイズすることもできます!(使いやすそう!)
https://osakanav.com/live2d-nizima
実際につかってみよう!
それでは早速サイトにアクセスします!

しばらく待っていると何か表示されそうですが、何も出てきません!笑
(ぐるぐる…。)

ページをスクロールしてみると、色々な種類のローディングアイコンが表示されます!(おお!)

丸だけではなく、横棒や…。

テキストも…!

さらに、少しトリッキーなものまで、色々な場面で使用できそうなものが揃っています!(どれもいい感じ✨)

気になるものを見つけたら、クリックしましょう!(ポチッと)

すると、HTML/CSSコードが表示されました!(ふむふむ…。)

右上のボタンから、それぞれコードを「コピー」しましょう!(よいしょ!)

ローディングアイコンを実装したいところに、コピーしたコードを貼り付ければOKです!
↓どこに貼り付ければ良いかわからない方は、こちらも参考になります。

↓実際のアイコンがこちら

読み込み中のデザインも、きれいにしよう〜!
これで全ての操作は完了です。(やった~!)
お疲れ様でした☕
ここまで読んでくださり、ありがとうございました!
https://osakanav.com/css-background-patterns

