ミニマリストプログレスバー
パステルカラーのミニマリストでフラットなデザインのプログレスバーコンポーネントで、プロのビジネスや企業のWebサイトに適しています。レスポンシブデザインで、Tailwind CSSを使用したダークモードに対応しています。
HTMLコード
<div class="w-full bg-gray-200 rounded-full h-2.5 dark:bg-gray-700">
<div class="bg-blue-400 h-2.5 rounded-full" style="width: 45%"></div>
</div>関連コンポーネント
スキューモーフィックプログレスバー
ポートフォリオ用のスキューモーフィックプログレスバーコンポーネントで、単色の配色と、Tailwind CSSを使用したレスポンシブモードとダークモードをサポートする複雑でインタラクティブなデザインが特徴です。
3Dグレースケールスポーツフィットネスプログレスバー
スポーツやフィットネスのアプリケーション向けに設計された複雑な3Dグレースケールプログレスバーコンポーネントで、トレーニングの進行状況を奥行きと視覚的なエンゲージメントで表示します。ダークモードのサポートが含まれており、完全にレスポンシブです。
ニューモーフィズムプログレスバー
ポートフォリオ用のニューモーフィズムスタイルのプログレスバーで、パステルカラーの配色、適度な複雑さ、応答性、ダークテーマのサポートが特徴です。JavaScriptは含まれていません。コンポーネントは HTML と Tailwind CSS で構築されています。