4 280 Codepen

SVG маска для фонового изображения

SVG маска для изображения. Удерживая левую кнопку мышки область маски будет расти и изображение вернется к своему исходному состоянию. Перемещая курсор мыши, область под ним будет отображать исходную картинку без маски.

SVG маска для фонового изображения
3 896 Codepen

Форма авторизации и регистрации

Совмещенная форма авторизации и регистрации в одном интерфейсе. Переключение сделано посредством табов с анимацией на CSS. Само переключение табов сделан на JS, также в скрипте добавлена проверка валидации для форм.

Форма авторизации и регистрации
1 805 Codepen

Звуковая анимация на paper.js

С помощью библиотеки paper.js (фреймворк работающий с векторной графикой на canvas) реализован музыкальный синтезатор. Просто нажимайте на английской раскладке буквы, и услышите воспроизведение звуковых эффектов.

Звуковая анимация на paper.js
4 884 Codepen

Капельный фон

Фон с эффектом перетекающих капель. Сделано с помощью SVG масок и CSS анимации.

Капельный фон