CCHub Logo CCHub Tailwind Collection
コンポーネント ローダー ミニマリストグレースケールローダー

ミニマリストグレースケールローダー

ミニマリスト/フラットデザイン、グレースケールの配色、レスポンシブデザインとダークテーマをサポートするビジネス/企業Webサイト向けの適度な複雑さのローダーコンポーネント。

プレビュー

HTMLコード 

<div class="flex items-center justify-center min-h-screen bg-gray-100 dark:bg-gray-900">
  <div class="w-16 h-16 border-4 border-gray-300 border-t-gray-900 rounded-full animate-spin dark:border-gray-700 dark:border-t-gray-100"></div>
</div>

関連コンポーネント

グレースケール ローディング スピナー

グレースケールカラーとマイクロインタラクションフォーカスを備えたシンプルなローディングスピナーコンポーネント。

開ける

ローダーコンポーネント

マテリアル デザインの原則に基づいて設計されたローダー コンポーネントで、ダーク モードとレスポンシブ エフェクトの Tailwind CSS サポートを備えています。

開ける

ローダーコンポーネント

Neumorphismスタイルでデザインされたシンプルなローダーコンポーネントで、補色の配色でコンテンツを消費します。

開ける