CCHub Logo CCHub Tailwind Collection
コンポーネント フッター バウハウス単色ヘルスケアフッター

バウハウス単色ヘルスケアフッター

バウハウスのデザイン原則に触発された、ヘルスケアアプリケーション向けのシンプルで機能的なフッターコンポーネント。単色の配色、レスポンシブレイアウト、ダークモードのサポートが特徴です。

プレビュー

HTMLコード 

<footer class="bg-gray-100 py-6 dark:bg-gray-900 border-t border-gray-200 dark:border-gray-800">
  <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 flex flex-col items-center text-center">
    <div class="mb-4">
      <a href="#" class="text-gray-800 dark:text-gray-200 text-2xl font-bold tracking-tight">MediCare</a>
    </div>
    <nav class="flex flex-wrap justify-center space-x-4 sm:space-x-6 mb-4">
      <a href="#" class="text-gray-600 hover:text-gray-900 dark:text-gray-400 dark:hover:text-gray-100 transition-colors duration-200 text-sm">Privacy Policy</a>
      <a href="#" class="text-gray-600 hover:text-gray-900 dark:text-gray-400 dark:hover:text-gray-100 transition-colors duration-200 text-sm">Terms of Service</a>
      <a href="#" class="text-gray-600 hover:text-gray-900 dark:text-gray-400 dark:hover:text-gray-100 transition-colors duration-200 text-sm">Contact Us</a>
    </nav>
    <p class="text-gray-500 dark:text-gray-500 text-xs sm:text-sm">&copy; 2023 MediCare. All rights reserved.</p>
  </div>
</footer>

関連コンポーネント

フッターコンポーネント

3D デザイン要素とアース トーンを備えたシンプルでレスポンシブなフッター コンポーネントで、ダーク テーマをサポートするブログやコンテンツ サイト向けに設計されています。

開ける

Industrial_Charity_Footer

非営利団体/慈善団体のWebサイト向けの複雑でレスポンシブなフッターコンポーネントで、レトロ/ビンテージのカラーパレットを備えたインダストリアルで生の美学が特徴です。ナビゲーション、連絡先情報、ソーシャルリンク、ニュースレターのサインアップが含まれ、ダークモードを完全にサポートしています。

開ける

Luxury_Premium_Crypto_Footer

暗号通貨/ブロックチェーンアプリケーション用のエレガントでレスポンシブなフッターコンポーネントで、限られた数のリンク、著作権、ソーシャルメディアアイコンが特徴です。ダークモードをサポートする企業の青い配色を使用します。

開ける