CSS製のローダーいろいろ

Result

dev.toに沢山紹介されていたので気に入ったものをピックアップしました

See the Pen <a href='https://codepen.io/t_afif/pen/MWpKbez'>The Dots</a> by Temani Afif (<a href='https://codepen.io/t_afif'>@t_afif</a>) on <a href='https://codepen.io'>CodePen</a>.

See the Pen <a href='https://codepen.io/t_afif/pen/poegNEO'>The Spinner</a> by Temani Afif (<a href='https://codepen.io/t_afif'>@t_afif</a>) on <a href='https://codepen.io'>CodePen</a>.

See the Pen <a href='https://codepen.io/t_afif/pen/GRWoNNm'>The continuous</a> by Temani Afif (<a href='https://codepen.io/t_afif'>@t_afif</a>) on <a href='https://codepen.io'>CodePen</a>.

See the Pen <a href='https://codepen.io/t_afif/pen/bGqEBgL'>The progress</a> by Temani Afif (<a href='https://codepen.io/t_afif'>@t_afif</a>) on <a href='https://codepen.io'>CodePen</a>.

See the Pen <a href='https://codepen.io/t_afif/pen/eYvJBvo'>The shapes</a> by Temani Afif (<a href='https://codepen.io/t_afif'>@t_afif</a>) on <a href='https://codepen.io'>CodePen</a>.

See the Pen <a href='https://codepen.io/t_afif/pen/bGqEBWv'>The pulsing</a> by Temani Afif (<a href='https://codepen.io/t_afif'>@t_afif</a>) on <a href='https://codepen.io'>CodePen</a>. 
コードはCodepenをご参照ください。

いろいろ試したけどCSS製が個人的には合ってるみたいです。
ただ、1から作るのすごく面倒なので参考にしたいです。

via

I made 100 CSS loaders for your next project

Result

via

Resources & Tools

OSS

AI

CSS snippet

JavaScript snippet

WordPress Code