ローダーコンポーネント

補色スキームのシンプルなダークモードローダーコンポーネント。

プレビュー

HTMLコード

<div class="flex items-center justify-center min-h-screen bg-gray-900">
  <div class="relative">
    <div class="h-24 w-24 rounded-full border-t-8 border-b-8 border-purple-500"></div>
    <div class="absolute top-0 left-0 h-24 w-24 rounded-full border-t-8 border-b-8 border-pink-500 animate-spin"></div>
  </div>
</div>

関連コンポーネント

ローダーコンポーネント

ブログやコンテンツ重視の Web サイト用にトライアドカラースキームを使用してスキューモーフィックスタイルでデザインされた Loaders コンポーネント。コンテンツの消費に適したシンプルなレイアウトが特徴で、ダークモードのサポートが組み込まれています。

開ける

NeonGlowウェザーローダー

ネオングロー効果、ブラックとホワイトのベース、ダークモードのサポートを含む鮮やかなアクセントカラーを備えた、シンプルで応答性の高いウェザー/クライメートローダーコンポーネント。

開ける

ニューモーフィズムローダー

補色を持つNeumorphism Loaderコンポーネント

開ける