Componentes Botón Seguir Botón Seguir con microinteracciones

Botón Seguir con microinteracciones

Componente de botón de seguimiento responsivo con soporte para temas oscuros y microinteracciones, diseñado para aplicaciones de redes sociales que utilizan Tailwind CSS. Cuenta con un esquema de color monocromático y elementos interactivos complejos.

Vista previa

Código 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>

Componentes relacionados

Botón Seguir

Un simple botón de seguimiento con estilo Material Design, efectos responsivos y compatibilidad con temas oscuros.

Abrir

Botón de seguimiento vibrante 3D

Un componente de botón de seguimiento simple inspirado en 3D con colores vibrantes para sitios web comerciales. Es responsivo e incluye soporte para temas oscuros que usan solo HTML y Tailwind CSS.

Abrir

Componente del botón Seguir

Un componente de botón 'Seguir' receptivo diseñado para plataformas de bienes raíces, con un esquema de color azul corporativo, soporte para modo oscuro y un sutil efecto de desplazamiento interactivo.

Abrir