Сайтодел | GitHub, Верстка, Сайты, Вайбкодинг
25.4K subscribers
1.33K photos
104 videos
28 files
2.38K links
FullStack-материалы от Senior-разработчика для WEB-специалистов

Сотрудничество: @CodingLead

РКН: shorturl.at/qinly
Download Telegram
This media is not supported in your browser
VIEW IN TELEGRAM
💾 Gooey Menu – оригинальное анимированное меню. При нажатии на центральную кнопку появляется полукруг из пунктов меню, которые как будто склеены между собой. Если навести курсор на меню, оно меняет цвет.

Сайтодел | #сниппет #css
🖥 Grocery Website Design – дизайн сайта для заказа и доставки съедобных продуктов. В приложении товары разбиты на категории, а также есть возможность оценивать их качество.

Сайтодел | #макет #figma
This media is not supported in your browser
VIEW IN TELEGRAM
💾 Gallery – минималистичная анимированная галерея для сайта. При наведении курсора изображение слегка увеличивается, а на карточке появляется подпись.

Сайтодел | #сниппет #css
🐙 Locomotive Scroll – библиотека, которая позволяет обнаруживать элементы в видимой области страницы и создавать плавную прокрутку с параллакс-эффектами.

Сайтодел | #репозиторий #github
This media is not supported in your browser
VIEW IN TELEGRAM
💾 Bubbly Button – анимация для кнопки в виде разлетающихся пузырьков. Она оживляет внешний вид сайта и делает любую форму интереснее.

Сайтодел | #сниппет #css
🖥 Plant App Freebies – дизайн мобильного приложения о растениях. Оно помогает распознать виды и дает о них информацию. В приложении есть как краткие справки о растениях, так и полноценные статьи.

Сайтодел | #макет #figma
This media is not supported in your browser
VIEW IN TELEGRAM
💾 Simple CSS Loaders – анимация для значков загрузки. Здесь представлены самые разные геометрические фигуры и движения. С ними пользователь не заскучает, пока загружается контент.

Сайтодел | #сниппет #css
🐙 Clean Code JavaScript – это руководство по созданию читаемого, многократно используемого и поддающегося рефакторингу программного обеспечения на JavaScript.

Сайтодел | #репозиторий #github
This media is not supported in your browser
VIEW IN TELEGRAM
💾 Scroll Arrow – эффект прокрутки экрана. При нажатии на кнопку со стрелкой экран плавно пролистывается вниз, при этом сама кнопка исчезает с экрана.

Сайтодел | #сниппет #css
🖥 Sign Up Form – дизайн формы для регистрации на лендинг. Особенности этого дизайна – броский шрифт в ретро-стиле и комфортный для глаз кремовый фон.

Сайтодел | #макет #figma
This media is not supported in your browser
VIEW IN TELEGRAM
💾 Material Design Hamburger – кнопка-гамбургер для сайтов. При нажатии она переворачивается, превращается в стрелку и показывает меню.

Сайтодел | #сниппет #css
🐙 PeachScript - плагин бесконечной прокрутки для Vue.js. Он подходит для работы с мобильными устройствами и отображает сообщения о результате загрузки.

Сайтодел | #репозиторий #github
This media is not supported in your browser
VIEW IN TELEGRAM
💾 Simple Page Transition – эффект перехода из одного раздела сайта на другой. При нажатии на кнопку страница пролистывается, меняет цвет и показывает новый контент.

Сайтодел | #сниппет #css
🖥 Weather App UI Design – дизайн мобильного приложения для определения погоды, выполненное в темных фиолетово-синих тонах. Фишка этого дизайна – детально выполненные 3D-изображения.

Сайтодел | #макет #figma
This media is not supported in your browser
VIEW IN TELEGRAM
💾 Budget Slider – слайдер, который наглядно показывает уровень финансов. Чем больше вы двигаете ползунок вправо, тем больше становится денежная сумма, выведенная на экран.

Сайтодел | #сниппет #css
🐙 Nanoid – небольшой и безопасный генератор строковых ID-идентификаторов для JavaScript, который работает с URL-адресами. Все ID-идентификаторы короткие и состоят из 21 символа.

Сайтодел | #репозиторий #github
This media is not supported in your browser
VIEW IN TELEGRAM
💾 Order Button Animation – анимация для кнопки подтверждения заказа. При нажатии кнопка превращается в грузовик, который едет по линии загрузки.

Сайтодел | #сниппет #css
🖥 Medical Appointment App – дизайн мобильного приложения для записи к врачу. Воспринимается легко благодаря светлым цветам и скругленным углам элементов.

Сайтодел | #макет #figma
This media is not supported in your browser
VIEW IN TELEGRAM
💾 CSS3 Checkbox Styles – стилизация чекбоксов на языке CSS. Здесь представлены круглые и квадратные флажки, слайдеры и переключатели.

Сайтодел | #сниппет #css
🐙 React-window – компоненты React для эффективного отображения больших списков и табличных данных. Сокращает объем работы и занимаемой памяти.

Сайтодел | #репозиторий #github
🖥 Charts UI Templates – минималистичный дизайн диаграмм для сайтов и мобильных приложений, выполненный в сине-голубых оттенках.

Сайтодел | #макет #figma