😎 Полу-кнопка Минималистичная кнопка, состоящая только из белого текста и тонкой белой линии снизу. При наведении линия плавно расширяется, превращаясь в прямоугольник, который подчеркивает текст. Простота и плавность анимации делают взаимодействие интуитивным и элегантным 🖥 Ссылка на код 🤓 Indigo Web | #фишка
Indigo Web | Frontend & Backend
В этом канале ты с интересом сможешь поддерживать и улучшать свои навыки. Задачки, разборы, модули, фишки, ресурсы и многое другое - здесь! Реклама и предложения - @mrlinux0
Графики
📊 Средний охват постов
📉 ERR % по дням
📋 Публикации по дням
📎 Типы контента
Лучшие публикации
20 из 20👨💻 Оптимизация отзывчивых изображений: использование sizes и srcset В этой статье: ⏺Эффективная загрузка ⏺Адаптивные изображения ⏺Ленивая загрузка — Статья объясняет, как использовать атрибуты sizes и srcset для оптимизации загрузки изображений на веб-страницах 🖥 Читать статью 🤓 Indigo Web | #статья
😎 Воссоздание анимации кнопки Google Gemini с помощью CSS В этой статье: ⏺Рисование и подготовка форм ⏺Разработка анимации ⏺Оптимизация и завершение — Статья описывает процесс воссоздания анимации кнопки Google Gemini в Gmail с использованием CSS и современных функций, таких как clip-path и анимации 🖥 Читать статью 🤓 Indigo Web | #статья
👨💻 Создание автономных приложений с TanStack DB: Руководство для разработчиков React В этой статье: ⏺Реактивное управление состоянием ⏺Оптимистичные мутации ⏺Live Queries для динамических данных — Статья раскрывает, как использовать TanStack DB для создания высокопроизводительных React-приложений с автономной поддержкой и мгновенной реакцией интерфейса 🖥 Читать статью 🤓 Indigo Web | #статья
👨💻 Prompting как дизайн: как создавать эффективные подсказки для ИИ В этой статье: ⏺Подсказка как инструкция для ИИ ⏺Структура WIRE+FRAME ⏺Практическое использование — Статья рассматривает процесс создания подсказок для ИИ через призму дизайна взаимодействия, предлагая структурированный подход с использованием фреймворка WIRE+FRAME для повышения качества и предсказуемости результатов 🖥 Читать статью 🤓 Indigo Web | #статья
🚀 Wasm 3.0: Революция в мире WebAssembly ❗ Команда WebAssembly объявила о завершении работы над Wasm 3.0 — масштабным обновлением стандарта, которое выводит WebAssembly на новый уровень. Это крупнейшее обновление с момента выхода Wasm 2.0, и оно привносит множество долгожданных функций, делающих платформу ещё мощнее и универсальнее Что нового в Wasm 3.0? 🔘64-битная адресация памяти 🔘Множественные области памяти 🔘Типизированные ссылки 🔊Wasm 3.0 - Здесь 🤓 Indigo Web | #news
😎 Веселье с пользовательскими курсорами: Два подхода к изменению курсора В этой статье: ⏺Простая замена курсора ⏺Анимированный курсор ⏺Динамический дизайн — Статья рассматривает два способа создания курсоров: использование CSS-свойства cursor для простых изменений и более сложный подход с JavaScript для анимации и динамического обновления курсорах 🖥 Читать статью 🤓 Indigo Web | #статья
👨💻 Кнопка с пером Яркая желтая кнопка с иконкой пера и текстом "Start Design". При наведении вокруг кнопки плавно появляется контур, словно нарисованный пером. Этот эффект создает ощущение креативности и легкости, подчеркивая идею дизайна 🖥 Ссылка на код 🤓 Indigo Web | #фишка
👨💻 Разноцветная кнопка Кнопка с яркой разноцветной обводкой привлекает внимание. При наведении она полностью заполняется разноцветным градиентом, а вокруг появляется плавная разноцветная тень. Этот эффект создает ощущение энергии и динамики, делая кнопку запоминающейся 🖥 Ссылка на код 🤓 Indigo Web | #фишка
😎 Медиа-запросы: современные подходы и практическое применение В этой статье: ⏺Новые возможности медиа-запросов ⏺Примеры использования hover, pointer, prefers-reduced-motion ⏺Оптимизация под пользовательские предпочтения — Статья раскрывает современные медиа-запросы, включая их новые синтаксисы и практические примеры для создания адаптивных и доступных интерфейсов 🖥 Читать статью 🤓 Indigo Web | #статья