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

Follow-Button-Komponente

Eine Follow-Button-Komponente, die im Brutalismus-Stil mit hohem Kontrast und einem rohen, kühnen Erscheinungsbild gestaltet ist. Es ist reaktionsschnell und unterstützt dunkle Themen.

Vorschau

HTML-Code 

<div class="flex flex-col items-center justify-center p-6 bg-white dark:bg-gray-800 rounded-lg shadow-lg">
    <img class="mb-4 rounded-full border-4 border-black dark:border-white" src="https://randomuser.me/api/portraits/men/1.jpg" alt="User Avatar" width="100" height="100">
    <h2 class="text-2xl font-bold text-black dark:text-white mb-2">Follow Us</h2>
    <p class="text-gray-700 dark:text-gray-300 text-center mb-4">Join our community and stay updated with our latest content!</p>
    <a href="#" class="px-4 py-2 text-lg font-bold text-white bg-black dark:bg-white dark:text-black border-4 border-black dark:border-white hover:bg-gray-600 dark:hover:bg-gray-300 transition-all duration-300">Follow</a>
</div>

Verwandte Komponenten

Follow-Button-Komponente

Eine reaktionsschnelle "Follow"-Button-Komponente mit einem bonbonfarbenen Farbschema, das für Jobbörsen und Karriereplattformen entwickelt wurde und Unterstützung für den Dunkelmodus bietet.

Offen

Follow-Button-Komponente

Eine komplexe, reaktionsschnelle Follow-Button-Komponente mit Glassmorphism-Stil und lebendigen Farben, die für Unternehmenswebsites mit Unterstützung für den Dunkelmodus mit Tailwind CSS entwickelt wurde.

Offen

Follow-Button-Komponente

Eine reaktionsschnelle Follow/Unfollow-Button-Komponente, die für Event- und Konferenz-Websites geeignet ist, mit Farbverlaufsübergängen, Unterstützung für den Dunkelmodus und einer hellen Akzentfarbe. Es enthält einen subtilen Hover-Effekt und ändert Text und Hintergrund beim Klicken (simuliert).

Offen