Кнопка «Подписаться» с микровзаимодействиями
Адаптивный компонент кнопки «Подписаться» с поддержкой темной темы и микровзаимодействиями, разработанный для приложений социальных сетей с использованием Tailwind CSS. Отличается монохроматической цветовой гаммой и сложными интерактивными элементами.
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>Связанные компоненты
Компонент кнопки «Следовать»
Кнопка «Подписаться» в стиле «Подписаться» в стиле «Ньюморфизм» для панели управления с поддержкой темной темы.
Компонент кнопки «Следовать»
Отзывчивый компонент кнопки «Подписаться» с конфетно-сладкой цветовой гаммой, разработанный для досок объявлений и карьерных платформ, с поддержкой темного режима.
Кнопка следования за стекломорфизмом
Отзывчивая кнопка подписки с дизайном Glassmorphism, поддержкой темного режима, использованием Tailwind CSS.