Огромное количество эффектов для кнопки при наведении на неё.
Реализовано с помощью HTML и CSS
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Реализовано с помощью HTML и CSS
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Frontend Trends
@trends_frontend
Каждый день собираем для вас готовые фичи с готовым кодом на CSS, JS, Vue, React, которые можно применять в своих проектах.
Связь: @devmangx
Frontend Trends (Russian)
Frontend Trends - канал, где каждый день собираются готовые фичи с готовым кодом на CSS, JS, Vue, React, которые можно применять в своих проектах. Если вы занимаетесь разработкой веб-приложений и всегда хотите быть в курсе последних тенденций во фронтенд разработке, то этот канал для вас. Здесь вы найдете актуальную информацию о новейших технологиях и подходах к созданию пользовательских интерфейсов. На канале trends_frontend вы сможете не только узнавать о последних трендах, но также получать готовый код и примеры применения ваших собственных проектах. Будьте в курсе современных методов разработки и следите за развитием фронтенд индустрии вместе с каналом Frontend Trends. Для связи и обратной связи по всем вопросам обращайтесь к администратору канала @devmangx.
Frontend Trends
05 Dec, 12:07
Преобразование кнопки в иконки соцсетей.
Реализовано с помощью HTML и CSS
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Реализовано с помощью HTML и CSS
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Frontend Trends
05 Dec, 07:30
Как тебе такая идея заработка?
Мария Ц. в первый заказ взяла разработку 6 экранов мобильного приложения. За работу оплачено 6 000₽.
Азизбек А. взялся за заказ «Доделать верстку одной страницы». Азизбек получил за свою работу в 30 000₽.
Евгений Ж. на веб-разработке полностью окупил обучение к середине курса, начал строительство собственного дома и наработал такую репутацию, что клиенты становятся в очередь.
Нет! Ни у кого из вышеперечисленных не было айтишного образования. Они просто прошли обучение у Романа Чернова – Fullstack-разработчика с опытом более 10 лет.
Сейчас Роман запускает бесплатный практический курс, где ты:
- Узнаешь, как зарабатывать на вёрстке сайтов и приложений
- Сверстаешь веб-сайт и загрузишь его в интернет
- Получишь советы по доработке от экспертов
- Поймёшь, что тебе делать, чтобы зарабатывать от 1000$
👉 Забрать обучение бесплатно
Мария Ц. в первый заказ взяла разработку 6 экранов мобильного приложения. За работу оплачено 6 000₽.
Азизбек А. взялся за заказ «Доделать верстку одной страницы». Азизбек получил за свою работу в 30 000₽.
Евгений Ж. на веб-разработке полностью окупил обучение к середине курса, начал строительство собственного дома и наработал такую репутацию, что клиенты становятся в очередь.
Нет! Ни у кого из вышеперечисленных не было айтишного образования. Они просто прошли обучение у Романа Чернова – Fullstack-разработчика с опытом более 10 лет.
Сейчас Роман запускает бесплатный практический курс, где ты:
- Узнаешь, как зарабатывать на вёрстке сайтов и приложений
- Сверстаешь веб-сайт и загрузишь его в интернет
- Получишь советы по доработке от экспертов
- Поймёшь, что тебе делать, чтобы зарабатывать от 1000$
👉 Забрать обучение бесплатно
Frontend Trends
05 Dec, 06:07
Hamburger menu animation with velocity.js
Ещё один вариант анимации для кнопки, открывающей меню сайта. Реализовано с помощью CSS и JS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Ещё один вариант анимации для кнопки, открывающей меню сайта. Реализовано с помощью CSS и JS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Frontend Trends
04 Dec, 16:07
При наведении курсора для написания текста у формы появляется контур.
Реализовано с помощью HTML и CSS
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Реализовано с помощью HTML и CSS
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Frontend Trends
04 Dec, 12:07
Gradient Background Animation
Анимированный фон с плавной сменой оттенков градиента. Реализовано с помощью CSS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Анимированный фон с плавной сменой оттенков градиента. Реализовано с помощью CSS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Frontend Trends
04 Dec, 06:07
Mobile Menu Animation
Плавное появление и исчезание полноэкранного меню по нажатию на кнопку внизу экрана. Реализовано с помощью CSS и JS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Плавное появление и исчезание полноэкранного меню по нажатию на кнопку внизу экрана. Реализовано с помощью CSS и JS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Frontend Trends
03 Dec, 16:07
Вертикальное меню с градиентной заливкой фона
Реализовано с помощью HTML и CSS
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Реализовано с помощью HTML и CSS
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Frontend Trends
03 Dec, 12:07
Анимация для открытия полноэкранного меню.
Здесь же реализован эффект наведения на пункты меню.
Реализовано с помощью HTML и CSS + JS
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Здесь же реализован эффект наведения на пункты меню.
Реализовано с помощью HTML и CSS + JS
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Frontend Trends
03 Dec, 06:07
Pulse button
Пульсирующая кнопка. Реализовано с помощью CSS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Пульсирующая кнопка. Реализовано с помощью CSS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Frontend Trends
02 Dec, 17:00
Флажки переключателя прячутся за полупрозрачной формой и появляются при выборе варианта.
Реализовано с помощью HTML и CSS
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Реализовано с помощью HTML и CSS
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Frontend Trends
02 Dec, 15:00
💻 Ты еще не в курсе последних IT-трендов? 🤯
Скорее всего, твои конкуренты уже внедряют новые фишки в проекты!
🚀 Эксклюзив в мире фронтенда, инсайды из мира технологий, лайфхаки для разработчиков – всё это уже ждёт тебя в моём блоге.
Не пропусти – будь впереди всех! 👀
🌐 Подписывайся прямо сейчас и прокачай свои навыки быстрее, чем другие напишут console.log('hello world')!
➡️ Перейти в канал ⬅️
Скорее всего, твои конкуренты уже внедряют новые фишки в проекты!
🚀 Эксклюзив в мире фронтенда, инсайды из мира технологий, лайфхаки для разработчиков – всё это уже ждёт тебя в моём блоге.
Не пропусти – будь впереди всех! 👀
🌐 Подписывайся прямо сейчас и прокачай свои навыки быстрее, чем другие напишут console.log('hello world')!
➡️ Перейти в канал ⬅️
Frontend Trends
02 Dec, 12:07
Строка поиска, которая раскрывается при нажатии на кнопку
Реализовано с помощью HTML и CSS, JS
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Реализовано с помощью HTML и CSS, JS
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Frontend Trends
02 Dec, 06:07
Navicon Transformicons
6 вариантов анимации бургер-кнопок. Реализовано с помощью SCSS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
6 вариантов анимации бургер-кнопок. Реализовано с помощью SCSS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Frontend Trends
01 Dec, 16:07
Необычный hover-эффект с появлением стрелки.
Реализовано с помощью HTML и CSS
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Реализовано с помощью HTML и CSS
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Frontend Trends
01 Dec, 12:07
Image Hover
Ещё один вариант анимации для карточки с изображением и описанием, которое появляется при наведении курсора мыши. Реализовано с помощью CSS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Ещё один вариант анимации для карточки с изображением и описанием, которое появляется при наведении курсора мыши. Реализовано с помощью CSS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Frontend Trends
01 Dec, 06:07
CSS 3 Loading
Простая и ненавязчивая анимация для ожидания загрузки. Реализовано с помощью CSS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Простая и ненавязчивая анимация для ожидания загрузки. Реализовано с помощью CSS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Frontend Trends
30 Nov, 16:07
Gradient Button Hover
Множество эффектов наведения курсора для кнопок с разным градиентом. Реализовано с помощью CSS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Множество эффектов наведения курсора для кнопок с разным градиентом. Реализовано с помощью CSS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Frontend Trends
30 Nov, 12:07
Наведение на соцсети с подсказкой в виде их названия
Реализовано с помощью HTML и CSS
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Реализовано с помощью HTML и CSS
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Frontend Trends
30 Nov, 06:07
Atom Button
Кнопка, при наведении на которую появляется светящийся атом и движется по контуру. Реализовано с помощью CSS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Кнопка, при наведении на которую появляется светящийся атом и движется по контуру. Реализовано с помощью CSS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Frontend Trends
29 Nov, 16:07
Загрузка в виде танцующих частиц, похожих на снежинки
Реализовано с помощью HTML и CSS
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Реализовано с помощью HTML и CSS
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Frontend Trends
29 Nov, 11:00
Social Share
Эффект для кнопок соц. сетей при наведении курсора мыши. Реализовано с помощью CSS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Эффект для кнопок соц. сетей при наведении курсора мыши. Реализовано с помощью CSS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Frontend Trends
29 Nov, 09:00
О чем поговорим:
Александр Абрамов, Сбер, расскажет, как скаффолдинг помогает снизить порог входа в проект, снизить bus-factor и повысить консистентность кода
Константин Логиновских, Cloud.ru, поделится секретами, как повысить гибкость и надежность кода.
ИТ-лидеры Сбера обсудят, что нужно веб-разработке, чтобы быть полноценной альтернативой нативным решениям, какие веб-приложения уже сегодня выходят за рамки классических браузеров и, конечно, в чем сила веба на сегодняшний день.
А также:
фуршет, подарки и много общения с топовыми экспертами - не упустите шанс и приходите за новыми идеями и вдохновением!
Frontend Trends
29 Nov, 06:07
Checkboxes and radios (dark/light)
Плавное перекрашивание кнопок-переключателей, выполненных в одном стиле с использованием градиента. Реализовано с помощью CSS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Плавное перекрашивание кнопок-переключателей, выполненных в одном стиле с использованием градиента. Реализовано с помощью CSS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Frontend Trends
28 Nov, 16:07
Пример анимированного подчеркивания с градиентной заливкой
Реализовано с помощью HTML и CSS
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Реализовано с помощью HTML и CSS
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Frontend Trends
28 Nov, 12:07
Buttons css hover effect
5 вариантов hover-эффекта для кнопок или ссылок. Реализовано с помощью CSS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
5 вариантов hover-эффекта для кнопок или ссылок. Реализовано с помощью CSS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Frontend Trends
28 Nov, 07:17
⚡️Всероссийский Хакатон ФИЦ 2024
🚀Попробуйте себя в одном из предложенных кейсов:
Кейс №2. Выявление трендов в сфере бухгалтерского учета, поиск «болей» бухгалтера: разработать алгоритм для поиска новых трендов и проблем бухгалтера.
Кейс №8. Формирование фото и видео контента с использованием нейросетей на основе биографии и фото персоны.
Кейс №10. Цифровая карта подземных коммуникаций с использованием Cesium.
Кейс №12. Цифровой сервис для ведения реестра зеленых насаждений города Москвы.
Кейс №17. Стартовый (профилактический) комплаенс: предотвращение рисков с помощью AI.
Кейс №19. Parallax-scroll лендинг для сайта Insidium.
И другие 19 кейсов смотрите на сайте: https://фиц2024.рф/hackathon
Хакатон пройдет в 2 этапа: Отборочный этап в Онлайн, Финал в Офлайн.
🏆Призовой фонд: 6 000 000 руб.
🔥Дедлайн регистрации: 28 ноября, 23:59
📅Даты отборочного этапа: 29 ноября - 2 декабря
🦾Даты финала: 3 - 4 декабря
Зарегистрируйтесь для участия в хакатоне: https://фиц2024.рф/hackathon
Реклама. ООО «Акселератор Возможностей», ИНН: 9704005146, erid:2VtzqwZkaCf
🚀Попробуйте себя в одном из предложенных кейсов:
Кейс №2. Выявление трендов в сфере бухгалтерского учета, поиск «болей» бухгалтера: разработать алгоритм для поиска новых трендов и проблем бухгалтера.
Кейс №8. Формирование фото и видео контента с использованием нейросетей на основе биографии и фото персоны.
Кейс №10. Цифровая карта подземных коммуникаций с использованием Cesium.
Кейс №12. Цифровой сервис для ведения реестра зеленых насаждений города Москвы.
Кейс №17. Стартовый (профилактический) комплаенс: предотвращение рисков с помощью AI.
Кейс №19. Parallax-scroll лендинг для сайта Insidium.
И другие 19 кейсов смотрите на сайте: https://фиц2024.рф/hackathon
Хакатон пройдет в 2 этапа: Отборочный этап в Онлайн, Финал в Офлайн.
🏆Призовой фонд: 6 000 000 руб.
🔥Дедлайн регистрации: 28 ноября, 23:59
📅Даты отборочного этапа: 29 ноября - 2 декабря
🦾Даты финала: 3 - 4 декабря
Зарегистрируйтесь для участия в хакатоне: https://фиц2024.рф/hackathon
Реклама. ООО «Акселератор Возможностей», ИНН: 9704005146, erid:2VtzqwZkaCf
Frontend Trends
28 Nov, 06:07
Card Hover Interactions
Описание и кнопка с действием на каждой карточке при наведении. Реализовано с помощью SCSS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Описание и кнопка с действием на каждой карточке при наведении. Реализовано с помощью SCSS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Frontend Trends
27 Nov, 16:07
FunAnimatedCard
Появление дополнительной информации при наведении курсора мыши на карточку. Реализовано с помощью CSS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Появление дополнительной информации при наведении курсора мыши на карточку. Реализовано с помощью CSS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Frontend Trends
27 Nov, 14:05
🕵️ФСБ отслеживает геолокацию каждого жителя страны в один клик, Google собирает платежные данные, а ВКонтакте сохраняет все отправленные и полученные сообщения в личных чатах и беседах.
IT ВЕДОМСТВО опять предупредило своих подписчиков, как разгрузить компьютер от слежки и лагов системы.
А ещё они рассказывают о признаках майнеров, новостях индустрии, лайфхаках, полезных трюках для айтишников - там найдете все.
Скажем, мало кто знает, что можно подменить свою локацию в Google или читать удаленные сообщения в Telegram.
💻 Подпишитесь на IT ВЕДОМСТВО — залог цифровой гигиены и компьютерной грамотности
IT ВЕДОМСТВО опять предупредило своих подписчиков, как разгрузить компьютер от слежки и лагов системы.
А ещё они рассказывают о признаках майнеров, новостях индустрии, лайфхаках, полезных трюках для айтишников - там найдете все.
Скажем, мало кто знает, что можно подменить свою локацию в Google или читать удаленные сообщения в Telegram.
💻 Подпишитесь на IT ВЕДОМСТВО — залог цифровой гигиены и компьютерной грамотности
Frontend Trends
27 Nov, 12:07
Link hover
Более 10 hover-эффектов для ссылок или кнопок. Реализовано с помощью SCSS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Более 10 hover-эффектов для ссылок или кнопок. Реализовано с помощью SCSS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Frontend Trends
27 Nov, 06:07
Image Hover
Эффект наведения на карточки с появлением кнопки "Подробнее". Реализовано с помощью CSS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Эффект наведения на карточки с появлением кнопки "Подробнее". Реализовано с помощью CSS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Frontend Trends
23 Nov, 06:07
Search Icon Input Animation
Поле поиска, которое плавно разворачивается при нажатии на кнопку с иконкой. Реализовано с помощью CSS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Поле поиска, которое плавно разворачивается при нажатии на кнопку с иконкой. Реализовано с помощью CSS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Frontend Trends
22 Nov, 16:07
Анимация ввода поиска разворачивается и сворачивается при нажатии на кнопки.
Реализовано с помощью HTML и CSS
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Реализовано с помощью HTML и CSS
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Frontend Trends
22 Nov, 12:07
CSS Menu Transition
Полноэкранное мобильное меню с поочередным появлением пунктов. Реализовано с помощью CSS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Полноэкранное мобильное меню с поочередным появлением пунктов. Реализовано с помощью CSS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Frontend Trends
22 Nov, 06:07
Search Icon Input Animation
Поле поиска, которое плавно разворачивается при нажатии на кнопку с иконкой. Реализовано с помощью CSS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Поле поиска, которое плавно разворачивается при нажатии на кнопку с иконкой. Реализовано с помощью CSS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Frontend Trends
21 Nov, 16:07
Плавное разворачивание меню с действиями при нажатии на бургер-кнопку
Реализовано с помощью HTML и CSS, JS
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Реализовано с помощью HTML и CSS, JS
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Frontend Trends
21 Nov, 12:07
Большой выбор эффектов наведения на кнопку
Реализовано с помощью HTML и CSS
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Реализовано с помощью HTML и CSS
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Frontend Trends
21 Nov, 11:07
⚡️Всероссийский Хакатон ФИЦ 2024
🚀Попробуйте себя в одном из предложенных кейсов:
1. Семантический делитель текстов: Разработать алгоритм, который сможет обеспечить точное разделение текста на блоки в рамках произвольно заданных ограничений размера блока.
2. Контекстный перевод названий научных работ: Разработать и реализовать переводчик, который будет переводить названия научных работ с русского на английский.
3. Прогнозирование бизнес драйверов: Разработать решение для задачи прогнозирования временных рядов бизнес-драйверов и произвести прогноз на следующий календарный месяц.
4. Система контроля и управления доступом: Разработка системы контроля и управления доступом в реальном времени. Система будет включать API для управления сотрудниками, точками доступа и интеграцию с системой видеонаблюдения.
И другие 16 кейсов смотрите на сайте: https://фиц2024.рф/hackathon
Хакатон пройдет в 2 этапа: Отборочный этап в Онлайн, Финал в Офлайн.
🏆Призовой фонд: 6 000 000 руб.
🔥Дедлайн регистрации: 26 ноября, 23:59
📅Даты отборочного этапа: 29 ноября - 2 декабря
🦾Даты финала: 3 - 4 декабря
Зарегистрируйтесь для участия в хакатоне: https://фиц2024.рф/hackathon
Реклама. ООО «Акселератор Возможностей», ИНН: 9704005146, erid: 2VtzquqsWwY
🚀Попробуйте себя в одном из предложенных кейсов:
1. Семантический делитель текстов: Разработать алгоритм, который сможет обеспечить точное разделение текста на блоки в рамках произвольно заданных ограничений размера блока.
2. Контекстный перевод названий научных работ: Разработать и реализовать переводчик, который будет переводить названия научных работ с русского на английский.
3. Прогнозирование бизнес драйверов: Разработать решение для задачи прогнозирования временных рядов бизнес-драйверов и произвести прогноз на следующий календарный месяц.
4. Система контроля и управления доступом: Разработка системы контроля и управления доступом в реальном времени. Система будет включать API для управления сотрудниками, точками доступа и интеграцию с системой видеонаблюдения.
И другие 16 кейсов смотрите на сайте: https://фиц2024.рф/hackathon
Хакатон пройдет в 2 этапа: Отборочный этап в Онлайн, Финал в Офлайн.
🏆Призовой фонд: 6 000 000 руб.
🔥Дедлайн регистрации: 26 ноября, 23:59
📅Даты отборочного этапа: 29 ноября - 2 декабря
🦾Даты финала: 3 - 4 декабря
Зарегистрируйтесь для участия в хакатоне: https://фиц2024.рф/hackathon
Реклама. ООО «Акселератор Возможностей», ИНН: 9704005146, erid: 2VtzquqsWwY
Frontend Trends
21 Nov, 06:07
custom checkboxes switch in pure CSS
Несколько вариантов для плавного переключения радио-кнопок и флажков. Реализовано с помощью CSS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Несколько вариантов для плавного переключения радио-кнопок и флажков. Реализовано с помощью CSS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Frontend Trends
20 Nov, 16:07
Множество эффектов наведения на ссылку
Реализовано с помощью HTML и CSS
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Реализовано с помощью HTML и CSS
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Frontend Trends
20 Nov, 12:07
Изображение преобразуется в информационную карточку при нажатии на значок
Реализовано с помощью HTML и CSS, JS
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Реализовано с помощью HTML и CSS, JS
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Frontend Trends
20 Nov, 06:00
Я айтишник и я устал!
С годами работы в IT все сильнее напрягает рутина, прокрастинация, куча задач и 0 желания их выполнять. Че делать?
Рекомендуем подписаться на того, кто уже не первый год работает с IT-специалистами и помогает им справиться с апатией и прокрастинацией - Психолог с научным подходом.
✔️ Как оторваться от ленты соцсетей и сесть за работу с удовольствием?
✔️ Как спокойно общаться с коллегами, если они бесят?
✔️ Как избавиться от постоянной тревожности?
✔️ Как успокоить конфликты в семье и перестать срываться на всех, а вместо этого получить поддержку и понимание со стороны близких?
Подписывайся на канал @remizov_changes - начни работать и жить в кайф, не скатываясь в кризисы и выгорание!
А в закрепе тебя уже ждут бонусы:
👨🏻💻 Видео, в котором ты найдёшь ответ на вопрос «Почему у тебя нет энергии и что с этим делать» + гайд как IT-специалисту вернуть энергию, даже если не получается отдохнуть.
С годами работы в IT все сильнее напрягает рутина, прокрастинация, куча задач и 0 желания их выполнять. Че делать?
Рекомендуем подписаться на того, кто уже не первый год работает с IT-специалистами и помогает им справиться с апатией и прокрастинацией - Психолог с научным подходом.
✔️ Как оторваться от ленты соцсетей и сесть за работу с удовольствием?
✔️ Как спокойно общаться с коллегами, если они бесят?
✔️ Как избавиться от постоянной тревожности?
✔️ Как успокоить конфликты в семье и перестать срываться на всех, а вместо этого получить поддержку и понимание со стороны близких?
Подписывайся на канал @remizov_changes - начни работать и жить в кайф, не скатываясь в кризисы и выгорание!
А в закрепе тебя уже ждут бонусы:
👨🏻💻 Видео, в котором ты найдёшь ответ на вопрос «Почему у тебя нет энергии и что с этим делать» + гайд как IT-специалисту вернуть энергию, даже если не получается отдохнуть.
Frontend Trends
20 Nov, 05:03
Hamburger menu transition
Немного измененная анимация для кнопки, открывающей меню. Реализовано с помощью CSS и JS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Немного измененная анимация для кнопки, открывающей меню. Реализовано с помощью CSS и JS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Frontend Trends
19 Nov, 16:07
Magic Card
Светящаяся карточка с эффектом при наведении. Реализовано с помощью CSS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Светящаяся карточка с эффектом при наведении. Реализовано с помощью CSS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Frontend Trends
19 Nov, 12:07
Soft hover card
Легкая тень, которая появляется при наведении на карточку. Реализовано с помощью CSS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Легкая тень, которая появляется при наведении на карточку. Реализовано с помощью CSS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Frontend Trends
19 Nov, 06:07
Login Form with floating placeholder and light button
Форма с эффектами для полей и анимацией для кнопки "Отправить". Реализовано с помощью CSS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Форма с эффектами для полей и анимацией для кнопки "Отправить". Реализовано с помощью CSS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Frontend Trends
18 Nov, 16:07
Прелоадер в виде большой растекающейся капли.
Реализовано с помощью HTML и CSS
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Реализовано с помощью HTML и CSS
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Frontend Trends
15 Nov, 07:30
Успей ухватить 7 дней бесплатного обучения фронтенд-разработке!
🔥 С нас обучение, практика и помощь с выходом на фриланс.
💻 Чем ты займешься:
1. Верстка с нуля
Освоишь HTML и CSS, создашь свой первый лендинг и полноценный веб-сайт.
2. JavaScript и интерактивность
Оживишь сайт с помощью JavaScript, а затем поработаешь с Angular и TypeScript.
3. Продакшен и хостинг
Подключишь Backend и выложишь сайт в интернет.
4. Адаптивность
Сделаешь адаптивную верстку, чтобы сайт выглядел отлично на любом устройстве.
🔥 На каждом этапе тебя поддержит куратор и поможет с заданиями.
Для кого подходит интенсив?
- Тем, кто хочет попрактиковаться в вёрстке сайтов
- Тем, кто хочет стабильно и уверенно зарабатывать на вёрстке сайтов
- Тем, кто хочет в IT, но не знает, с чего начать
👉 Проскочить на интенсив бесплатно
🔥 С нас обучение, практика и помощь с выходом на фриланс.
💻 Чем ты займешься:
1. Верстка с нуля
Освоишь HTML и CSS, создашь свой первый лендинг и полноценный веб-сайт.
2. JavaScript и интерактивность
Оживишь сайт с помощью JavaScript, а затем поработаешь с Angular и TypeScript.
3. Продакшен и хостинг
Подключишь Backend и выложишь сайт в интернет.
4. Адаптивность
Сделаешь адаптивную верстку, чтобы сайт выглядел отлично на любом устройстве.
🔥 На каждом этапе тебя поддержит куратор и поможет с заданиями.
Для кого подходит интенсив?
- Тем, кто хочет попрактиковаться в вёрстке сайтов
- Тем, кто хочет стабильно и уверенно зарабатывать на вёрстке сайтов
- Тем, кто хочет в IT, но не знает, с чего начать
👉 Проскочить на интенсив бесплатно
Frontend Trends
15 Nov, 06:07
Steam Library App Portrait Card Effect
Очередной эффект при наведении на карточки. Реализовано с помощью CSS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Очередной эффект при наведении на карточки. Реализовано с помощью CSS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Frontend Trends
14 Nov, 16:01
Responsive sidebar revealed on click and key press
Реализовано с помощью HTML и CSS, JS
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Реализовано с помощью HTML и CSS, JS
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Frontend Trends
14 Nov, 14:07
Amazing card animation (circle effect)
Реализовано с помощью HTML и CSS, JS
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Реализовано с помощью HTML и CSS, JS
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Frontend Trends
14 Nov, 11:07
Устали бороться с древним кодом? Чувствуете, что легаси по-тихоньку захватывает ваш проект? 😱
Приглашаем на онлайн-митап «Как лиду работать с легаси?», где лид фронтенд-разработчик Мерка, Никита Шальнев, поделится проверенными техниками борьбы с «программным наследием».
О чем будем говорить?
- Что такое легаси-код и откуда он берется?
- Как обнаружить легаси в проекте?
- Какую ошибку постоянно совершают лиды?
- Как предотвратить появление легаси и сохранить код чистым?
- Рефакторинг или ... может, ну его? 😜
Встречаемся с вами в 19:00 МСК в канале @merkteam ⬅️
👉 Подписывайтесь, чтобы не пропустить митап, а заодно быть в курсе других мероприятий, открытых вакансий в Мерке и полезных айти-новостей от меркурианских разработчиков.
Приглашаем на онлайн-митап «Как лиду работать с легаси?», где лид фронтенд-разработчик Мерка, Никита Шальнев, поделится проверенными техниками борьбы с «программным наследием».
О чем будем говорить?
- Что такое легаси-код и откуда он берется?
- Как обнаружить легаси в проекте?
- Какую ошибку постоянно совершают лиды?
- Как предотвратить появление легаси и сохранить код чистым?
- Рефакторинг или ... может, ну его? 😜
Встречаемся с вами в 19:00 МСК в канале @merkteam ⬅️
👉 Подписывайтесь, чтобы не пропустить митап, а заодно быть в курсе других мероприятий, открытых вакансий в Мерке и полезных айти-новостей от меркурианских разработчиков.
Frontend Trends
14 Nov, 06:07
Startaê's background animation using particles.js
Плавное движение частиц на тёмном фоне. Реализовано с помощью JS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Плавное движение частиц на тёмном фоне. Реализовано с помощью JS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Frontend Trends
13 Nov, 16:07
Burg Menu Animation CSS
Реализовано с помощью HTML и CSS
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Реализовано с помощью HTML и CSS
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Frontend Trends
13 Nov, 12:07
Social Icon Gooey Effects
Реализовано с помощью HTML и CSS, JS
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Реализовано с помощью HTML и CSS, JS
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Frontend Trends
13 Nov, 06:07
Holiday Feature Folding Cards
Анимация для фона с частицами, движущимися по сетке. Реализовано с помощью CSS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Анимация для фона с частицами, движущимися по сетке. Реализовано с помощью CSS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Frontend Trends
12 Nov, 16:07
Social Button Share Animation
Эффект появления списка соц. сетей для кнопки "Поделиться". Реализовано с помощью CSS и JS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Эффект появления списка соц. сетей для кнопки "Поделиться". Реализовано с помощью CSS и JS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Frontend Trends
12 Nov, 12:07
Preloader Kitchen Knife
Реализовано с помощью HTML и CSS, JS
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Реализовано с помощью HTML и CSS, JS
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Frontend Trends
12 Nov, 06:07
CSS Animations: Obvious CTA Buttons
Анимация, которая позволит привлечь внимание пользователя к кнопке с действием. Реализовано с помощью CSS
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Анимация, которая позволит привлечь внимание пользователя к кнопке с действием. Реализовано с помощью CSS
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Frontend Trends
09 Nov, 06:07
Link Hover Interaction | SplittingJS
Эффектная анимация при наведении на ссылки с текстом. Реализовано с помощью CSS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Эффектная анимация при наведении на ссылки с текстом. Реализовано с помощью CSS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Frontend Trends
08 Nov, 16:07
Full Screen Menu Animation
Реализовано с помощью HTML и CSS, JS
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Реализовано с помощью HTML и CSS, JS
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Frontend Trends
08 Nov, 12:07
CodePen Home Custom 404 Page
Реализовано с помощью HTML и SCSS
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Реализовано с помощью HTML и SCSS
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Frontend Trends
08 Nov, 06:07
Morphing On/Off Button
Постепенное преобразование кнопки при ее включении и выключении. Реализовано с помощью CSS и JS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Постепенное преобразование кнопки при ее включении и выключении. Реализовано с помощью CSS и JS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Frontend Trends
07 Nov, 16:07
Hamburger Menu Interaction
Очередной способ анимировать кнопку для открытия мобильного меню. Реализовано с помощью CSS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Очередной способ анимировать кнопку для открытия мобильного меню. Реализовано с помощью CSS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Frontend Trends
07 Nov, 14:07
Всё лучшее про IT бесплатно — уже на Базе
Frontend Trends
07 Nov, 12:07
Menu
Плавное появление бокового меню при нажатии на бургер-кнопку. Реализовано с помощью CSS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Плавное появление бокового меню при нажатии на бургер-кнопку. Реализовано с помощью CSS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Frontend Trends
07 Nov, 06:07
World Places (CSS 3d hover)
3D-эффект наведения курсора на карточки с изображением и кратким описанием. Реализовано с помощью CSS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
3D-эффект наведения курсора на карточки с изображением и кратким описанием. Реализовано с помощью CSS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Frontend Trends
06 Nov, 16:07
CodePen Home Creative Wave Button
Реализовано с помощью HTML и SCSS
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Реализовано с помощью HTML и SCSS
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Frontend Trends
06 Nov, 14:07
⚡️ Экс-сотрудник лаборатории Касперского создал два канала по IT и кибербезопасности
▪️ Пакет безопасности
▪️ Культ безопасности
Здесь вы узнаете ТОП-10 IT-гигантов в России с самой слабой защитой от взломов, какие компании «барыжат» вашими персональными данными и как этому противостоять.
Для людей из индустрии: полезный софт, ИИшки для работы, новости из сферы и куча полезностей, которые не найдёте в других каналах.
Подписывайтесь: раз и два.
▪️ Пакет безопасности
▪️ Культ безопасности
Здесь вы узнаете ТОП-10 IT-гигантов в России с самой слабой защитой от взломов, какие компании «барыжат» вашими персональными данными и как этому противостоять.
Для людей из индустрии: полезный софт, ИИшки для работы, новости из сферы и куча полезностей, которые не найдёте в других каналах.
Подписывайтесь: раз и два.
Frontend Trends
06 Nov, 12:07
Flying Letter
Реализовано с помощью HTML и CSS
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Реализовано с помощью HTML и CSS
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Frontend Trends
06 Nov, 06:07
Аnimated Form
Эффект для переключения между формами входа и регистрации. Реализовано с помощью CSS и JS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Эффект для переключения между формами входа и регистрации. Реализовано с помощью CSS и JS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Frontend Trends
05 Nov, 16:07
Menu Hover Html/SCSS
Эффект наведения на пункты меню с постепенным закрашиванием текста по горизонтали. Реализовано с помощью CSS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Эффект наведения на пункты меню с постепенным закрашиванием текста по горизонтали. Реализовано с помощью CSS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Frontend Trends
05 Nov, 08:10
cool hover card
Эффект наведения на карточку с плавным размытием изображения. Реализовано с помощью CSS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Эффект наведения на карточку с плавным размытием изображения. Реализовано с помощью CSS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Frontend Trends
05 Nov, 06:10
Все надоело и пропал интерес, чувствуешь себя амебой и хочется только залипать в телефоне. Бывает?
Психолог взрослого человека - канал для айтишников, у которых периодически опускаются руки и отключается мозг, ибо переработки и постоянная тревожность не приводят к другим исходам.
✔️ Как научиться отвлекаться от работы и отдыхать?
✔️ Как совместить кучу рабочих задач и время с семьей?
✔️ Как справиться с прокрастинацией?
✔️ Как не растерять запал, даже если начальник и коллеги 💩 и кажется, что ничего не выходит?
Подписывайтесь на канал @vadimpetrov_psy и научитесь работать без упахивания, выгорания и ущерба для личной жизни!
👨🏻💻 Псс. Заходите в закреп канала - там много полезного, и даже бесплатный мини-курс.
https://t.me/+-kDHcC_11fozNzcy
Психолог взрослого человека - канал для айтишников, у которых периодически опускаются руки и отключается мозг, ибо переработки и постоянная тревожность не приводят к другим исходам.
✔️ Как научиться отвлекаться от работы и отдыхать?
✔️ Как совместить кучу рабочих задач и время с семьей?
✔️ Как справиться с прокрастинацией?
✔️ Как не растерять запал, даже если начальник и коллеги 💩 и кажется, что ничего не выходит?
Подписывайтесь на канал @vadimpetrov_psy и научитесь работать без упахивания, выгорания и ущерба для личной жизни!
👨🏻💻 Псс. Заходите в закреп канала - там много полезного, и даже бесплатный мини-курс.
https://t.me/+-kDHcC_11fozNzcy
Frontend Trends
05 Nov, 05:10
Wall of text
Плавно движущиеся строки с текстом в качестве фона для вашего сайта. Реализовано с помощью SCSS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Плавно движущиеся строки с текстом в качестве фона для вашего сайта. Реализовано с помощью SCSS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Frontend Trends
04 Nov, 16:07
Exploration
Реализовано с помощью HTML и SCSS
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Реализовано с помощью HTML и SCSS
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Frontend Trends
04 Nov, 12:07
Smooth Pulse Button
Пульсирующая кнопка для воспроизведения видео. Реализовано с помощью CSS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Пульсирующая кнопка для воспроизведения видео. Реализовано с помощью CSS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Frontend Trends
04 Nov, 08:07
Выбирай направление и обучайся:
Пост удалится через 48 часов
Frontend Trends
04 Nov, 06:07
Hamburger Icon Animation
6 вариантов анимации для кнопки, которая открывает и закрывает мобильное меню. Реализовано с помощью CSS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
6 вариантов анимации для кнопки, которая открывает и закрывает мобильное меню. Реализовано с помощью CSS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Frontend Trends
26 Oct, 16:07
404_Error
Реализовано с помощью HTML и CSS
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Реализовано с помощью HTML и CSS
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Frontend Trends
26 Oct, 12:07
Moving clouds background animation
Легкое движение облаков в качестве фона для вашего сайта. Реализовано с помощью CSS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Легкое движение облаков в качестве фона для вашего сайта. Реализовано с помощью CSS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Frontend Trends
26 Oct, 06:07
Desktop Menu Animation
Появление боковых вкладок меню при нажатии на бургер-кнопку Реализовано с помощью CSS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Появление боковых вкладок меню при нажатии на бургер-кнопку Реализовано с помощью CSS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Frontend Trends
25 Oct, 16:07
Particles Background Animation Effects
Хаотичное движение цветных частиц в качестве фона сайта или приложения. Реализовано с помощью CSS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Хаотичное движение цветных частиц в качестве фона сайта или приложения. Реализовано с помощью CSS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Frontend Trends
25 Oct, 14:07
Frontend Trends
25 Oct, 12:07
css preloader
Ожидание загрузки в виде прыгающих частиц, которые меняют свой цвет при столкновении. Реализовано с помощью CSS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Ожидание загрузки в виде прыгающих частиц, которые меняют свой цвет при столкновении. Реализовано с помощью CSS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Frontend Trends
25 Oct, 06:07
Linear-gradient button animation
Градиентный контур у кнопки, который переливается при наведении курсора мыши. Реализовано с помощью CSS
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Градиентный контур у кнопки, который переливается при наведении курсора мыши. Реализовано с помощью CSS
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Frontend Trends
24 Oct, 16:07
Converting a checkbox when running tasks
Преобразование флажка при выполнении задач по аналогии с заметками. Реализовано с помощью CSS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Преобразование флажка при выполнении задач по аналогии с заметками. Реализовано с помощью CSS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Frontend Trends
24 Oct, 12:07
CodePen Home Animated Social Links
Реализовано с помощью HTML и SCSS
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Реализовано с помощью HTML и SCSS
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Frontend Trends
24 Oct, 06:07
Menu animation
4 варианта анимации при наведении на пункт меню. Реализовано с помощью CSS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
4 варианта анимации при наведении на пункт меню. Реализовано с помощью CSS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Frontend Trends
23 Oct, 16:07
Карточки будто бы делают шаг вперёд при наведении на них.
Реализовано с помощью HTML и CSS
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Реализовано с помощью HTML и CSS
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Frontend Trends
23 Oct, 12:07
<!-- Social Icons Start !-->
Реализовано с помощью HTML и CSS и JS
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Реализовано с помощью HTML и CSS и JS
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Frontend Trends
23 Oct, 08:00
🚀 Senior-разработчики делится секретами фронтенда в канале @frontendino
Ежедневно разбираем сложные темы простым языком, показываем примеры кода и решаем реальные задачи.
👉 Присоединяйтесь к сообществу профессионалов
Ежедневно разбираем сложные темы простым языком, показываем примеры кода и решаем реальные задачи.
👉 Присоединяйтесь к сообществу профессионалов
Frontend Trends
23 Oct, 06:07
Card: On hover blur effect
Эффект наведения на карточки с затемнением остальных. Реализовано с помощью CSS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Эффект наведения на карточки с затемнением остальных. Реализовано с помощью CSS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Frontend Trends
22 Oct, 16:07
CodePen Home Radio Button Animation
Реализовано с помощью HTML и CSS
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Реализовано с помощью HTML и CSS
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Frontend Trends
22 Oct, 12:07
Cube Effect Slider
Слайдер с кубическим эффектом. Реализовано с помощью CSS и JS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
Слайдер с кубическим эффектом. Реализовано с помощью CSS и JS.
🔗 Код: Codepen
👉 @trends_frontend | #эффект
5,088
subscribers
15
photos
26
videos
