🧰業務効率化
CSSローディングアニメーション作成
回転・点滅・パルスのローディングCSSを生成
- ✓ 無料
- ✓ 登録不要
- ✓ ブラウザだけで動作
- ✓ データ送信なし
ファイルや入力内容は、原則としてお使いのブラウザ内で処理されます。
読み込み中や送信中に使えるアニメーションをCSSだけで作成できます。入力値はブラウザー内だけで処理し、送信・保存しません。
1. 動きの種類を選ぶ
2. 大きさ・色・速度を調整
3. プレビュー
4. CSSとHTMLをコピー
使うときのポイント
- 生成するHTMLには、スクリーンリーダーへ状態を伝える
role="status"と説明を含めています。 - 動きを減らす設定を利用している人向けに、
prefers-reduced-motionの停止処理を含めています。 - 処理が完了したらローディング表示を非表示にし、完了またはエラーを別途伝えてください。