CCHub Logo CCHub Tailwind Collection
Komponenten Schaltfläche "Folgen" Follow-Button-Komponente

Follow-Button-Komponente

Eine reaktionsschnelle Follow-Button-Komponente, die nach den Prinzipien des Material Designs entwickelt wurde und Unterstützung für den Dunkelmodus und maßgeschneiderte Stile mit Tailwind CSS bietet.

Vorschau

HTML-Code 

<div class="flex items-center justify-center p-4">
  <div class="bg-white dark:bg-gray-800 shadow-md rounded-lg p-5 transition-shadow duration-300 hover:shadow-lg">
    <div class="flex items-center">
      <img src="https://randomuser.me/api/portraits/men/1.jpg" alt="User Avatar" class="w-12 h-12 rounded-full shadow-lg mr-3">
      <div class="flex-1">
        <h2 class="text-lg font-semibold text-gray-800 dark:text-gray-200">Follow Me</h2>
        <p class="text-gray-600 dark:text-gray-400">Join my journey and stay updated!</p>
      </div>
      <button class="bg-blue-500 hover:bg-blue-600 text-white font-bold py-2 px-4 rounded transition duration-300 ease-in-out">
        Follow
      </button>
    </div>
  </div>
</div>

Verwandte Komponenten

Neumorphe Follow-Button-Komponente

Eine komplexe, interaktive, neumorphe Follow-Button-Komponente mit Ozean-/Blautönen, die für Social-Media-Schnittstellen entwickelt wurde. Inklusive Unterstützung für den Dunkelmodus und responsives Design.

Offen

Follow-Button-Komponente

Eine reaktionsschnelle "Follow"-Button-Komponente, die für Immobilienplattformen entwickelt wurde, mit einem blauen Farbschema für Unternehmen, Unterstützung für den Dunkelmodus und einem subtilen interaktiven Hover-Effekt.

Offen

Follow-Button-Komponente

Eine komplexe, reaktionsschnelle "Follow"-Button-Komponente mit Farbverlauf und gedämpften Farbübergängen, die für Immobilienplattformen entwickelt wurde. Enthält Unterstützung für den Dunkelmodus und verwendet semantisches HTML.

Offen