CSS-live.ru

Еженедельная подборка красивых эффектов на 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. Это тоже может быть интересно:

1 комментарий

  1. Привет друг!
    В нашем сообществе уже почти 2 тысячи человек! Всего за пол месяца мы набрали 400 новых подписчиков и удержали, а это значит, что контент у нас по настоящему годный.

    У нас ты сам увидишь :

    1. Хорошие статьи для твоего обучения в мире фрондента;

    2. Много разных задач и решения их. А самому сообразительному даётся достижение.

    3. Первый поток курса (конечно, если ты ещё не успел зайти на него, ведь он ограничен в рамках людей).

    Заходи к нам ТЛГ  deveveloper_house_jun_front

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

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

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