SVG morphing с anime.js
При клике по кнопке плавно из левого верхнего угла раскрывается новый блок. Анимация раскрытия сделана с использованием anime.js, которая анимирует svg
Ледяная звезда
На three.js ледяная звезда, которая с течением времени увеличивается в размерах
Генератор случайных разноцветных кружков
Генератор на canvas разноцветных рандомных кругов.
Гонки за амебой по css grid ячейкам
Эффект наведения на ячейки css grid, который похож, как будто мы преследуем какую-то кляксу или амёбу. При этом, все сделано на CSS
Параллакс из фоновых изображений
Несложный пример создания собственного параллакс эффекта из нескольких дивов с фоновым изображением, которые наложены слоями друг на друга.
SVG filter — текст в виде мозгов
SVG фильтр добавляющий тексту начертание похожее на мозги (feColorMatrix, feTurbulence, feGaussianBlur, feSpecularLighting)
Эффект тесселяции при наведении на ячейку в grid css
Эффект тесселяции при наведении на ячейки в сетке. Сетка grid построена на базе 200 блоков. Сделан эффект на чистом CSS
Боковое выезжающее меню
При клике на иконку стрелки выезжает боковая панель с навигацией. Анимация сделана с помощью GSAP.
Прелоадер на CSS
Анимированный лоадер на CSS
Border-radius — площадка для тестов
Площадка для демонстрации возможностей CSS свойства border-radius.
SVG filter — текст с брызгами
SVG фильтр добавляющий тексту эффект брызг (feColorMatrix, feTurbulence, feGaussianBlur, feDisplacementMap, feComposite)
SVG filter — текст с текстурой зебры
SVG фильтр придающий тексту эффект текстуры в стиле зебра.