Привет всем, друзья!
Сегодня хочу поделится с вами пеном, который одновременно показывает политическую ситуацию в США и странах Европы, а также имеет очень крутую фишку в плане анимации.
В этом пене написана фраза «Black Lives MATTER», и суть анимации в том, что каждая буква постоянно окрашивается в разные цвета и появятся эффект будто цвет переливается из правой стороны в левую. Вся анимация сделана css, но для разделения фразы на отдельные буквы использовалась библиотека splitting.
Думаю внеся несколько изменений в анимации, можно использовать это в своих проектах.
Ссылка на пен: https://codepen.io/sasha-adeleb/pen/JjGjqpE
#BlackLivesMatter
#codepen
Сегодня хочу поделится с вами пеном, который одновременно показывает политическую ситуацию в США и странах Европы, а также имеет очень крутую фишку в плане анимации.
В этом пене написана фраза «Black Lives MATTER», и суть анимации в том, что каждая буква постоянно окрашивается в разные цвета и появятся эффект будто цвет переливается из правой стороны в левую. Вся анимация сделана css, но для разделения фразы на отдельные буквы использовалась библиотека splitting.
Думаю внеся несколько изменений в анимации, можно использовать это в своих проектах.
Ссылка на пен: https://codepen.io/sasha-adeleb/pen/JjGjqpE
#BlackLivesMatter
#codepen
Привет друзья!
В прошлый раз совсем забыл написать пост с пеном, затем как и обещал отправил 50.000 сум первому кто мне об этом написал. На этот раз деньги остаются у меня)
Ну а сегодня хочу поделиться пеном, который связан с сегодняшним событием - затмением. На пене изображены Луна и Солнце.
Луной можно управлять с помощью курсора, а Солнце расположено по середине, и чем ближе луна приближается к Солнцу тем темнее становится небо. Эта анимация сделана при помощи технологии canvas, раньше сам тоже создавал прикольные анимации на ней.
Ссылка на пен: codepen
#codepen
В прошлый раз совсем забыл написать пост с пеном, затем как и обещал отправил 50.000 сум первому кто мне об этом написал. На этот раз деньги остаются у меня)
Ну а сегодня хочу поделиться пеном, который связан с сегодняшним событием - затмением. На пене изображены Луна и Солнце.
Луной можно управлять с помощью курсора, а Солнце расположено по середине, и чем ближе луна приближается к Солнцу тем темнее становится небо. Эта анимация сделана при помощи технологии canvas, раньше сам тоже создавал прикольные анимации на ней.
Ссылка на пен: codepen
#codepen
Привет друзья!
Cегодня нашел очень классный пен с эффектной анимацией скролла. При прокрутки страницы вниз текст в среднем блоке приближается, пока полностью не заполнит экран картинкой. После этого появляется цитата и скролл работает как обычно.
Буду использовать это в своих будущих проектах, так как выглядит очень красиво. Кстати сайт apple.com часто использует такую фишку.
Ссылка на пен: https://codepen.io/robbiecren07/pen/WNQqGYV
#codepen
Cегодня нашел очень классный пен с эффектной анимацией скролла. При прокрутки страницы вниз текст в среднем блоке приближается, пока полностью не заполнит экран картинкой. После этого появляется цитата и скролл работает как обычно.
Буду использовать это в своих будущих проектах, так как выглядит очень красиво. Кстати сайт apple.com часто использует такую фишку.
Ссылка на пен: https://codepen.io/robbiecren07/pen/WNQqGYV
#codepen
Привет всем.
Сегодня очередной пост с #codepen. На этот раз я нашел просто прикольный пен с глазами, которые следят за курсором мыши, а также переливается различными цветами.
Все анимации сделаны при помощи технологии canvas, как и я говорил в предыдущих постах это самая удобная в плане оптимизации технология для создания анимаций.
Ссылка на пен: https://codepen.io/Mamboleoo/pen/yLeobeP
Сегодня очередной пост с #codepen. На этот раз я нашел просто прикольный пен с глазами, которые следят за курсором мыши, а также переливается различными цветами.
Все анимации сделаны при помощи технологии canvas, как и я говорил в предыдущих постах это самая удобная в плане оптимизации технология для создания анимаций.
Ссылка на пен: https://codepen.io/Mamboleoo/pen/yLeobeP
Привет!
Продолжаем рубрику #codepen. Сегодня нашел довольно интересный пен с формой регистрации и авторизации.
Здесь можно переключать кнопкой формы, то есть либо зарегистрироваться, либо войти в аккаунт, и при нажатие на кнопку происходит 3д вращение карточки.
Считаю это очень удобной системой, так как на большинстве сайтов, чтобы переключится между авторизацией и регистрацией нужно переходить на разные страницы.
Ссылка на пен: https://codepen.io/ig_design/pen/KKVQpVP
Продолжаем рубрику #codepen. Сегодня нашел довольно интересный пен с формой регистрации и авторизации.
Здесь можно переключать кнопкой формы, то есть либо зарегистрироваться, либо войти в аккаунт, и при нажатие на кнопку происходит 3д вращение карточки.
Считаю это очень удобной системой, так как на большинстве сайтов, чтобы переключится между авторизацией и регистрацией нужно переходить на разные страницы.
Ссылка на пен: https://codepen.io/ig_design/pen/KKVQpVP
Привет всем!
Сегодня поделюсь с вам еще одним интересным пеном.
Анимация появления слов на чистом css и еще в добавок есть возможность выставления в очередь разных фраз, чтобы они появлялись друг за другом.
Полезный пен, его можно внедрить практически в каждый проект и использовать анимацию например на слоган компании.
Ссылка на пен: https://codepen.io/Sonick/pen/HthaI
#codepen
Сегодня поделюсь с вам еще одним интересным пеном.
Анимация появления слов на чистом css и еще в добавок есть возможность выставления в очередь разных фраз, чтобы они появлялись друг за другом.
Полезный пен, его можно внедрить практически в каждый проект и использовать анимацию например на слоган компании.
Ссылка на пен: https://codepen.io/Sonick/pen/HthaI
#codepen
Привет 👋
Сегодня нашел для вас пен с панелью меню.
Активная ссылка выделяется цветным фоном, а при наведении на ссылку, овальный индикатор перемещается зависимости от ее расположения.
Кстати использовал похожее меню на одном из своих сайтов.
Ссылка на пен: codepen.io/EricPorter/pen/YzKrqMp
#codepen
Сегодня нашел для вас пен с панелью меню.
Активная ссылка выделяется цветным фоном, а при наведении на ссылку, овальный индикатор перемещается зависимости от ее расположения.
Кстати использовал похожее меню на одном из своих сайтов.
Ссылка на пен: codepen.io/EricPorter/pen/YzKrqMp
#codepen
Привет!
Очередной пост на рубрику #codepen.
На этот раз хочу поделиться с вами пеном с оплатой банковских карт.
На пене изображены 3 карты, при нажатии на одну из них происходит плавная анимация сворачивания, затем появляются детали оплаты.
Можно использовать это в интернет-магазине, для пользователей, которые сохранили несколько своих карт.
Ссылка на пен: codepen.io/gokul_ramesh/pen/RwrzJGr
Очередной пост на рубрику #codepen.
На этот раз хочу поделиться с вами пеном с оплатой банковских карт.
На пене изображены 3 карты, при нажатии на одну из них происходит плавная анимация сворачивания, затем появляются детали оплаты.
Можно использовать это в интернет-магазине, для пользователей, которые сохранили несколько своих карт.
Ссылка на пен: codepen.io/gokul_ramesh/pen/RwrzJGr
Привет Друзья!
Продолжаем рубрику #codepen.
Сегодня наткнулся на очередную панель меню с необычным переходом ссылок. При клике на ссылку 2 квадратика перемещаются в сторону ссылку и становятся ее задним фоном.
В пене также присутствует туториал по созданию такого меню, советую просмотреть!
Ссылка на пен: https://codepen.io/PointC/details/VweJeGJ
Продолжаем рубрику #codepen.
Сегодня наткнулся на очередную панель меню с необычным переходом ссылок. При клике на ссылку 2 квадратика перемещаются в сторону ссылку и становятся ее задним фоном.
В пене также присутствует туториал по созданию такого меню, советую просмотреть!
Ссылка на пен: https://codepen.io/PointC/details/VweJeGJ
Привет!
Снова продолжаю выкладывать пены с #codepen
В этот раз нашел необычные анимации при наведении на кнопки. Всего анимаций 16 и все выполнены только при помощи css.
Ссылка на пен: codepen.io/yuhomyan/pen/LYNVVNO
Снова продолжаю выкладывать пены с #codepen
В этот раз нашел необычные анимации при наведении на кнопки. Всего анимаций 16 и все выполнены только при помощи css.
Ссылка на пен: codepen.io/yuhomyan/pen/LYNVVNO
Привет!
Еще один полезный пен из codepen.
В этом проекте сделана фильтрация карточек по категориям. При смене категории происходит плавная анимация исчезновения лишних карточек.
Очень удобно в использовании на своем сайте, так как пен написан без использования javascript.
Cсылка на пен: codepen.io/codewithjalaj/details/wvGKZNy
#codepen
Еще один полезный пен из codepen.
В этом проекте сделана фильтрация карточек по категориям. При смене категории происходит плавная анимация исчезновения лишних карточек.
Очень удобно в использовании на своем сайте, так как пен написан без использования javascript.
Cсылка на пен: codepen.io/codewithjalaj/details/wvGKZNy
#codepen
Привет!
Еще один полезный пен из codepen.
В этом проекте сделаны специальные блоки, надписи которых следуют за курсором мыши.
На мой взгляд это очень креативно и можно использовать во многих вариантах сайтов.
Cсылка на пен: codepen.io/silvandiepen/pen/wvGKWav
#codepen
Еще один полезный пен из codepen.
В этом проекте сделаны специальные блоки, надписи которых следуют за курсором мыши.
На мой взгляд это очень креативно и можно использовать во многих вариантах сайтов.
Cсылка на пен: codepen.io/silvandiepen/pen/wvGKWav
#codepen
Привет!
Сегодня делюсь с вами пеном, который сделан на чистом css.
На этом пене идет анимация слов 'css', 'is', 'awesome'. Ниже оставлю видео этой анимации.
Ссылка на пен: codepen.io/ainalem/details/oNxXRgW
#codepen
Сегодня делюсь с вами пеном, который сделан на чистом css.
На этом пене идет анимация слов 'css', 'is', 'awesome'. Ниже оставлю видео этой анимации.
Ссылка на пен: codepen.io/ainalem/details/oNxXRgW
#codepen
Привет!
Нашел для вас крутой пен, с креативными анимациями для ссылок.
Советую использовать в своих проектах, будет смотреться очень необычно😉
Ссылка на пен: codepen.io/jhancock532/pen/GRZrLwY
#codepen
Нашел для вас крутой пен, с креативными анимациями для ссылок.
Советую использовать в своих проектах, будет смотреться очень необычно😉
Ссылка на пен: codepen.io/jhancock532/pen/GRZrLwY
#codepen