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

Glassmorphism Follow-Button

Ein responsiver Follow-Button mit Glassmorphism-Design, Unterstützung für den Dunkelmodus und Verwendung von Tailwind CSS.

Vorschau

HTML-Code 

<template>
  <button class="relative inline-flex items-center justify-center p-0.5 mb-2 me-2 overflow-hidden text-sm font-medium text-gray-900 rounded-lg group bg-gradient-to-br from-purple-600 to-blue-500 group-hover:from-purple-600 group-hover:to-blue-500 hover:text-white dark:text-white focus:ring-4 focus:outline-none focus:ring-blue-300 dark:focus:ring-blue-800">
    <span class="relative px-5 py-2.5 transition-all ease-in duration-75 bg-white dark:bg-gray-900 rounded-md group-hover:bg-opacity-0 backdrop-filter backdrop-blur-lg bg-opacity-20">
      Follow
    </span>
  </button>
</template>

Verwandte Komponenten

Glassmorphism Follow-Button

Glassmorphism Follow Button Komponente für Social Media mit dunklem Thema

Offen

Glassmorphism_Music_Follow_Button_Component

Eine komplexe, monochromatische Glasmorphismus-Follow-Button-Komponente, die für Musik- und Audioplattformen entwickelt wurde, mit mattglasähnlichen, durchscheinenden Elementen mit Unschärfeeffekten, vollständig reaktionsschnell und mit Unterstützung des Dunkelmodus.

Offen

Follow-Button-Komponente

Eine komplexe "Follow"-Button-Komponente mit Mikrointeraktionen, sepiafarbenem/braunem Farbschema, responsivem Design und Unterstützung für den Dunkelmodus, geeignet für Blog-/Content-Plattformen.

Offen