Loader

読み込み中や処理中であることを伝えるためのコンポーネントです。

使用上の注意

ローディングアイコンと背景のコントラスト比を確保する

青いPrimary、白いLightのいずれも場合でも、背景色とのコントラスト比を保つよう注意してください。

アクセシビリティガイドラインに基づき、3:1以上のコントラスト比になるように調整してください。

読み込みが1秒未満で終わる場合は使用しない

読み込み時間1秒未満の場合は、画面のチラつきが生まれて体験を損なうので使用しないようにしてください。

使い方チェックリスト

Loader

参照元：使用上の注意 > ローディングアイコンと背景のコントラスト比を確保する 「使用上の注意 > ローディングアイコンと背景のコントラスト比を確保する」の本文へ移動

• Must

  ローディングアイコンは背景色とのコントラスト比を保つ

  • ウェブアクセシビリティ簡易チェックリストに基づき、3:1 以上のコントラスト比になるように調整する

参照元：使用上の注意 > 読み込みが1秒未満で終わる場合は使用しない 「使用上の注意 > 読み込みが1秒未満で終わる場合は使用しない」の本文へ移動

• Avoid

  読み込み時間が 1 秒未満の場合は Loader を使用しない

Props