Pulsante Segui con microinterazioni
Componente pulsante Segui reattivo con supporto per temi scuri e microinterazioni, progettato per applicazioni di social media che utilizzano Tailwind CSS. Presenta una combinazione di colori monocromatica ed elementi interattivi complessi.
Codice HTML
<div class="flex items-center justify-center h-screen bg-gray-100 dark:bg-gray-900">
<div class="relative inline-block group">
<button class="px-6 py-3 text-sm font-semibold text-white bg-blue-600 rounded-full transition-all duration-300 ease-in-out transform group-hover:scale-105 group-active:scale-95 focus:outline-none focus:ring-2 focus:ring-blue-500 dark:bg-blue-700 dark:group-hover:bg-blue-600 dark:focus:ring-blue-600">
Follow
</button>
<div class="absolute inset-0 rounded-full bg-blue-500 opacity-0 blur transition-all duration-500 ease-in-out group-hover:opacity-70"></div>
</div>
</div>
Componenti correlati
BrutalistaSeguiPulsante
Un pulsante di inseguimento brutalista con supporto per la modalità reattiva e oscura.
Componente pulsante Segui
Un componente reattivo Segui pulsante progettato in stile Material Design con supporto per la modalità oscura utilizzando Tailwind CSS.
Componente pulsante Segui
Un componente del pulsante follow progettato in stile brutalismo con un contrasto elevato e un aspetto grezzo e audace. È reattivo e supporta temi scuri.