CCHub Logo CCHub Tailwind Collection
コンポーネント 進行状況インジケーター 3D プログレスバーコンポーネント

3D プログレスバーコンポーネント

3Dエフェクト、Tailwind CSS、レスポンシブデザイン、ダークモードのサポートでスタイリングされています。

プレビュー

HTMLコード 

<div class='relative pt-1 dark:bg-gray-800'>
  <div class='overflow-hidden h-2 text-xs flex rounded bg-gray-200 dark:bg-gray-700'>
    <div style='width: 45%' class='shadow-none flex flex-col text-center whitespace-nowrap text-white justify-center bg-blue-500 dark:bg-blue-400'></div>
  </div>
  <div class='mt-2 text-right text-xs dark:text-gray-400'>45% Complete</div>
</div>

関連コンポーネント

進行状況インジケータ コンポーネント

ハイコントラストのブルータリストスタイルのプログレスインジケーターコンポーネントで、ポートフォリオ内の作品や製品を紹介します。複数のインタラクティブ要素を備えた豊富なインターフェイスを備えており、Tailwind CSSを使用したダークテーマのサポートでレスポンシブになるように設計されています。

開ける

進行状況インジケータ コンポーネント

80年代と90年代のレトロ/ヴィンテージの美学に触発されたシンプルなプログレスインジケーターコンポーネントで、補色の配色を利用しています。ソーシャルメディアインターフェイス用に設計されており、ダークテーマのサポートで応答性があります。

開ける

進行状況インジケータ コンポーネント

レスポンシブデザインとTailwind CSSを使用したダークテーマのサポートを特徴とするレトロ/ビンテージスタイルのプログレスインジケーターコンポーネント。

開ける