CCHub Logo CCHub Tailwind Collection
コンポーネント フッター ミニマリストのソーシャルメディアフッター

ミニマリストのソーシャルメディアフッター

ソーシャルメディアインターフェイス用のアースカラーの配色を備えたミニマリストのフッターコンポーネント。ダークテーマのサポートによるレスポンシブ。

プレビュー

HTMLコード 

<footer class="bg-gray-200 dark:bg-gray-800 py-6">
  <div class="container mx-auto px-4">
    <div class="flex flex-col md:flex-row justify-between items-center">
      <div class="mb-4 md:mb-0">
        <p class="text-gray-700 dark:text-gray-300 text-sm">&copy; 2023 SocialMedia. All rights reserved.</p>
      </div>
      <div class="flex space-x-4">
        <a href="#" class="text-gray-700 dark:text-gray-300 hover:text-gray-900 dark:hover:text-white transition duration-300 ease-in-out">
          <i class="fab fa-facebook-f"></i>
        </a>
        <a href="#" class="text-gray-700 dark:text-gray-300 hover:text-gray-900 dark:hover:text-white transition duration-300 ease-in-out">
          <i class="fab fa-twitter"></i>
        </a>
        <a href="#" class="text-gray-700 dark:text-gray-300 hover:text-gray-900 dark:hover:text-white transition duration-300 ease-in-out">
          <i class="fab fa-instagram"></i>
        </a>
        <a href="#" class="text-gray-700 dark:text-gray-300 hover:text-gray-900 dark:hover:text-white transition duration-300 ease-in-out">
          <i class="fab fa-linkedin-in"></i>
        </a>
      </div>
    </div>
  </div>
</footer>

関連コンポーネント

Memphis_Purple_Entertainment_Footer_Component

エンターテインメント/メディアプラットフォーム向けのシンプルなフッターコンポーネントで、大胆な紫紫色、幾何学的な要素、ダークモードをサポートする完全な応答性を備えたメンフィスデザインスタイルが特徴です。

開ける

Industrial_Candy_Footer_Component

フォーラム/コミュニティプラットフォーム用のレスポンシブフッターコンポーネントで、「インダストリアル」の美学と「キャンディ/スウィート」のアクセントが特徴です。ナビゲーションリンク、ソーシャルメディアアイコン、著作権、ニュースレターのサインアップが含まれ、ダークモードを完全にサポートしています。

開ける

フッターコンポーネント

Neumorphism スタイルで設計された Footer コンポーネントで、Tailwind CSS を使用したレスポンシブエフェクトとダークテーマをサポートします。

開ける