Подборка hover - эффектов для кнопки.

Коллекция из 20 эффектов наведения на кнопку на чистом CSS.

#hover

Кнопка «Поделиться в социальных сетях».

Данная кнопка открывает меню с ссылками на разные социальные сети при наведении. Имеет плавную анимацию раскрытия и наведения.

❗ Использовались SCSS и JS (Babel)

#виджет

Коллекция ховеров для текста и навигации.

Небольшой набор классических анимации для текста при наведении. Можно использовать для ссылок, кнопок или меню навигации.

❗ Использовался SCSS.

#hover

Кнопка Лайк с анимацией при клика

Элемент имеет счетчик количества нажатии и анимацию при клике.
Нейтральный дизайн позволит использовать данный элемент в любом проекте.

❗Использовались SCSS и JS

#анимация

Карточка товара с анимированной рамкой

Подобный блок имеет анимированную градиентную рамку и эффектом появления при наведении.
Хорошо пойдет для разного типа контента.

🍀 Чистый CSS

#анимация

Кнопка с анимацией конфетти.

Кнопка подписки анимированная эффектом конфетти при нажатии.
Довольно сложная, но красочная анимация.

❗ Использовались SCC(SCSS) И JS.

#кнопка

Dark mode toggle switcher

Переключатель светлого и темного режима, реализованный на чистом CSS.

#переключатель #css

ScrollTrigger

Скролл для главной страницы сайта, реализованный с помощью SVG, CSS и JavaScript

#скролл #css #js #svg

In-n-out box-shadow animation

Анимация теней для окна ввода-вывода, реализованная на CSS и JavaScript

#анимация #css #js

Fluid text hover

Плавное наведение курсора на текст, реализованное с помощью SVG, CSS, JavaScript

#анимация #css #js #svg

Expandable Animated Card Slider

Расширяемый анимированный слайдер, реализованный на CSS, JavaScript

#слайдер #css #js

CSS Minimal Dark Mode Toggle Button

Минималистичная кнопка переключения темного режима, реализованная на чистом CSS

#переключатель #css

Spider

Анимация следования за курсором, реализованная на чистом JavaScript с минимальным использованием CSS

#анимация #js #css

SVG Fireworks

Анимация клика по экрану, реализованная с помощью SVG, CSS, JavaScript

#анимация #svg #css #js

Off The Wall Image Menu

Меню изображений со стены, реализованное на CSS, JavaScript

#меню #css #js

Nyan Pig

Анимация экрана загрузки контента сайта, реализованный на CSS(SCSS), JavaScript

#анимация #scss #js

Animated tabs

Анимированная панель вкладок, реализованная на CSS, JavaScript

#анимация #css #js

Sliding tabs

Скользящая панель вкладок, реализованная на CSS(SCSS)

#анимация #scss

Continuous List Hover Transitions

Непрерывные переходы при наведении курсора на список, реализованные на CSS, JavaScript

#переход #css #js

Rainbow-background

Радужный фон, реализованный на чистом CSS

#фон #css

Liquid Transition Effect

Эффект переливающейся воды, реализованный на CSS(SCSS), JavaScript

#эффект #scss #js