Еженедельная подборка красивых эффектов на CSS/SVG/JS #79

Подборка свежих эффектов, интересных идей и полезных наработок.

«Мона Лиза» из линий

Технологии: canvas, JS.
Автор: Никита Дубко (@dark_mefody)

Мона Лиза из линий Посмотреть живой пример


Крестики-нолики на CSS

Технологии: CSS, SVG, CSS-анимация.
Автор: Jhey (@jh3y)

Крестики-нолики на CSS Посмотреть живой пример


Портрет Криса Койера

Технологии: SVG, CSS, CSS-анимация, Vue.js, Tween max.js.
Автор: Дэвид Стоут (@davidastout3)

Портрет Криса Койера Посмотреть живой пример


Переключатель в виде теннисного мяча

Технологии: SVG, React.js, GSAP.
Автор: Крис Ганнон (@chrisgannon)

Переключатель в виде теннисного мяча Посмотреть живой пример


CSS-анимация иконок меню

Технологии: CSS, CSS-трансформации.
Автор: Оливия (@oliviale)

Анимация иконок меню Посмотреть живой пример


Демонстрация работы функции crossfade()

Под иллюстрацией есть ползунок для изменения значения cross-fade.
Технологии: CSS, CSS-функция crossfade(), JS, jQuery.js.
Автор: Брайан Хаферкамп (@brianhaferkamp)

Демонстрация работы функции crossfade() Посмотреть живой пример


UI на чистом CSS

Технологии: CSS.
Автор: Адам Кун (@cobra_winfrey)

UI на чистом CSS Посмотреть живой пример


Рука-загрузчик на CSS

Технологии: CSS, CSS-фильтры, CSS-анимация, CSS-трансформации.
Автор: Стив Гарднер (@steveg3003)

Рука-загрузчик Посмотреть живой пример


Анимация рукописного текста

Технологии: CSS, SVG.
Автор: Марина (@marinamcpeak)

Анимация рукописного текста Посмотреть живой пример


Мишка-переключатель на CSS

Технологии: CSS, CSS-анимация.
Автор: Анастасия Гудвин (@agoodwin)

Мишка-переключатель на CSS Посмотреть живой пример


Пожелания и идеи по содержанию следующих выпусков приветствуем в комментариях.

P.S. Это тоже может быть интересно:

Оставить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *

Ваш E-mail не будет опубликован

Получать новые комментарии по электронной почте. Вы можете подписаться без комментирования.