Follow-Button-Komponente

Ein Follow-Button im Neumorphism-Stil für ein Dashboard mit Unterstützung für dunkle Themen.

Vorschau

HTML-Code

<div class="flex justify-center items-center h-screen bg-gray-800 dark:bg-gray-900">
    <button class="relative inline-flex items-center justify-center p-4 bg-gray-200 dark:bg-gray-700 rounded-full shadow-lg transition-transform transform hover:scale-105 active:scale-95 dark:shadow-inner shadow-gray-300 ">
        <span class="absolute inset-0 rounded-full bg-gradient-to-r from-pink-400 via-red-500 to-yellow-500 opacity-20 blur transition-all duration-500"></span>
        <span class="relative text-white font-bold text-lg">
            Follow
        </span>
    </button>
</div>

Verwandte Komponenten

Follow-Button-Komponente

Eine komplexe Follow-Button-Komponente, die mit einem Glasmorphismus-Effekt unter Verwendung eines komplementären Farbschemas entwickelt wurde, geeignet für E-Commerce-Anwendungen, mit responsivem Design und Unterstützung für dunkle Themen.

Offen

Follow-Button-Komponente

Eine reaktionsschnelle Follow-Button-Komponente, die im Material Design-Stil mit Unterstützung für den Dunkelmodus unter Verwendung von Tailwind CSS entworfen wurde.

Offen

Follow-Button-Komponente

Ein sauberer, minimalistischer "Follow"-Button mit einer Retro-/Vintage-Farbpalette, der sich für ein Dashboard oder eine Profilseite eignet. Er verfügt über einen interaktiven Hover-Status und Unterstützung für den Dunkelmodus, der die Prinzipien der schweizerischen/internationalen Typografie verkörpert.

Offen