Уроки
Step-by-step tutorials applying color science concepts to real-world design and development tasks.
Генерация цветных OG-изображений с Next.js и Satori
Динамические Open Graph изображения с Next.js и Satori. Цвето-адаптивные OG-шаблоны с градиентами, фирменными цветами и адаптивным дизайном.
Обновлено Фев 24, 2026
Пользовательские свойства CSS для динамических цветовых систем
Узнайте, как создавать поддерживаемые и настраиваемые цветовые системы с помощью пользовательских свойств CSS. Охватывает переменные, светлый/тёмный режим и изменение цветов через JavaScript.
Обновлено Фев 18, 2026
Цвета Tailwind CSS: полное руководство по системе оттенков
Освойте систему цветов Tailwind CSS: стандартная палитра, соглашение об оттенках 50-950, пользовательские цвета в конфигурации и новый подход через CSS-переменные в Tailwind v4.
Обновлено Фев 11, 2026
Реализация тёмной темы: полное руководство для разработчиков
Как реализовать тёмную тему с CSS-переменными, prefers-color-scheme, JavaScript-переключателем и правильной адаптацией цветов для любого веб-проекта.
Обновлено Фев 04, 2026
Создание веб-компонента выбора цвета с нуля
Создайте доступный выбор цвета в виде Web Component. Реализуйте рендеринг на canvas, ползунки оттенка, альфа-канал и пользовательские события через Shadow DOM.
Обновлено Фев 02, 2026
CSS color-mix(): нативное смешивание цветов в браузере
Изучите CSS color-mix() для нативного смешивания цветов в браузере. Освойте синтаксис, цветовые пространства, практические кейсы и создавайте динамические палитры без JavaScript.
Обновлено Янв 31, 2026
Цветовой охват: sRGB, P3 и Rec. 2020
Разберитесь в цветовых охватах — sRGB, Display P3 и Rec. 2020 — и узнайте, как использовать широкоохватные цвета в CSS с @media (color-gamut) для современных дисплеев. Практические примеры.
Обновлено Янв 28, 2026
Функции цвета CSS: сравнение rgb(), hsl(), oklch()
Сравните все функции цвета CSS — rgb(), rgba(), hsl(), hsla(), lab(), lch(), oklch() и color-mix(). Узнайте, какую и когда использовать, и как обстоит дело с поддержкой браузеров.
Обновлено Янв 22, 2026
Перцептивные Цветовые Пространства: Lab, LCH, Oklab, OKLCH
Перцептивно равномерные цветовые пространства — CIE Lab, LCH, Oklab и OKLCH. Принципы разработки, преимущества каждого и выбор для CSS и дизайна.
Обновлено Янв 22, 2026
Figma Auto-Layout с Цветовыми Токенами
Создавайте auto-layout-компоненты в Figma с архитектурой цветовых токенов. Привязка переменных, адаптивные токены, варианты тем и передача разработчикам.
Обновлено Янв 15, 2026
Цветопроба: обеспечение точности цветов при печати
Узнайте о методах мягкой пробы, твёрдой пробы и пробного оттиска для обеспечения точного воспроизведения цветов при печати — от экрана до финального результата.
Обновлено Янв 13, 2026
CMYK для веб-дизайнеров: когда печать встречается с экраном
Веб-дизайнерам, работающим над печатными проектами, необходимо понимать CMYK. Узнайте о различиях цветовых охватов, безопасных стратегиях конвертации RGB в CMYK, процессах печатной вёрстки и распространённых ошибках.
Обновлено Янв 12, 2026
Как Бумага Влияет на Цвет: Материал и Качество Печати
Как тип, покрытие и плотность бумаги влияют на цвет в печати. Различия между мелованной, немелованной и специальной бумагой для точной цветопередачи.
Обновлено Янв 09, 2026
Тиснение фольгой и металлические цвета в полиграфии
Узнайте о технологиях тиснения фольгой, вариантах металлических красок, выборе золотой и серебряной фольги и дизайнерских соображениях для премиальных печатных материалов.
Обновлено Янв 08, 2026
Многобрендовая цветовая архитектура: одна кодовая база — множество тем
Создайте многобрендовую цветовую архитектуру с помощью CSS-переменных и дизайн-токенов. Поддержка white-label тематизации из единой кодовой базы с интеграцией Tailwind.
Обновлено Янв 06, 2026
Цвет в 3D и WebGL: линейное цветовое пространство и PBR
Разберитесь в цвете для 3D-рендеринга — sRGB и линейный RGB, гамма-коррекция, PBR-цвета материалов, управление цветом в Three.js и HDR в веб-3D.
Обновлено Янв 02, 2026
Цвет для сторителлинга с данными: за пределами стандартных цветов диаграмм
Выйдите за рамки стандартных цветов диаграмм. Изучите последовательные, дивергентные и категориальные палитры, доступность в визуализации данных и цветовые шкалы в D3/Chart.js.
Обновлено Дек 29, 2025
Анимация цвета в CSS: переходы и ключевые кадры
Освойте анимацию цвета в CSS с помощью переходов, ключевых кадров, вращения оттенка HSL, интерполяции OKLCH для перцептивной плавности и лучших практик производительности.
Обновлено Дек 26, 2025
CSS-функция light-dark(): нативное переключение тем
Используйте CSS light-dark() для нативного переключения тем. Замените JavaScript-переключатели и медиазапросы одной CSS-функцией для цветов светлого и тёмного режима.
Обновлено Дек 24, 2025
Цветовая Модель RGB: Как Экраны Отображают Цвет
Цветовая модель RGB: смешение цветов, диапазон 0–255, функция rgb() в CSS и почему экраны отображают 16,7 миллиона цветов.
Обновлено Дек 20, 2025
Рабочий процесс управления цветом: от экрана до печати
Освойте управление цветом от калибровки монитора до пруфинга в печати. Узнайте, как ICC-профили, мягкий пруфинг и последовательный рабочий процесс сохраняют точность цвета.
Обновлено Дек 14, 2025
Построение цветовой системы для дизайн-системы
Создайте систематизированную цветовую архитектуру для дизайн-системы: соглашения об именовании, генерация оттенков, семантические токены и паттерны реализации.
Обновлено Дек 09, 2025
Проектирование Color API: REST-эндпоинты для работы с цветом
Разработайте RESTful API для работы с цветом: конвертация, поиск, проверка контрастности и генерация палитр. Схемы данных и лучшие практики.
Обновлено Дек 06, 2025
Техники работы с цветом в SVG: заливка, обводка и градиенты
Освойте техники работы с цветом в SVG: атрибуты fill и stroke, линейные и радиальные градиенты, ключевое слово currentColor и стилизация SVG через CSS для современной веб-разработки.
Обновлено Ноя 29, 2025
Правило 60-30-10: пропорции цвета в дизайне
Освойте правило 60-30-10 для работы с цветом в дизайне. Узнайте, как взаимодействуют доминирующий, вспомогательный и акцентный цвета, с реальными примерами, hex-кодами и советами по обоснованному нарушению правила.
Обновлено Ноя 24, 2025
Цветоделение для печати: как подготовить файлы
Разберитесь в CMYK-цветоделении, плашечных цветах, треппинге и регистрационных метках. Подготовьте файлы, готовые к печати, с правильными цветоделёнными пластинами.
Обновлено Ноя 21, 2025
HSL vs HSV: какую цветовую модель выбрать?
Поймите разницу между цветовыми моделями HSL и HSV, когда каждая из них уместна для веб-разработки или цветовых пикеров, и как обе соотносятся с CSS-функциями цвета.
Обновлено Ноя 19, 2025
Семантические цветовые системы: именуйте цвета по назначению, а не по оттенку
Создавайте семантические цветовые системы, называющие цвета по назначению (успех, предупреждение, ошибка). Архитектура токенов и реализация в CSS и Tailwind.
Обновлено Ноя 14, 2025
Синтаксис относительных цветов CSS: динамическое преобразование цветов
Освойте синтаксис относительных цветов CSS для динамического преобразования цветов. Регулируйте оттенок, насыщенность, светлоту и альфа-каналы прямо в таблицах стилей.
Обновлено Ноя 10, 2025
Дизайн для режима высокой контрастности: Windows, macOS и веб
Проектируйте для режима высокой контрастности в Windows, macOS и на вебе. Узнайте о CSS forced-colors, ключевых словах системных цветов, стратегиях тестирования и типичных ошибках.
Обновлено Ноя 06, 2025
Hex-коды цветов: полное руководство
Освойте hex-коды цветов с нуля. Узнайте, что означает #RRGGBB, как читать любое hex-значение, сокращённую нотацию, прозрачность альфа-канала и как конвертировать между форматами.
Обновлено Окт 29, 2025
Цвет в генеративном искусстве: алгоритмы для красивых палитр
Создавайте красивые цвета в генеративном искусстве с помощью HSL-спиралей, шумовых палитр, золотого сечения и цветовых алгоритмов p5.js для процедурной эстетики.
Обновлено Окт 26, 2025
Динамическая цветовая тематизация в React: за пределами CSS-переменных
Динамическая тематизация в React с помощью CSS-переменных, провайдеров контекста и Tailwind CSS. Создание пользовательских тем с генерацией цветов во время выполнения.
Обновлено Окт 23, 2025
Система подбора цветов Pantone: руководство для дизайнера
Узнайте, как работает Система подбора цветов Pantone, в чём разница между книгами для мелованной и немелованной бумаги, что такое плашечные и процессные цвета и каковы ограничения конвертации Pantone в hex.
Обновлено Окт 19, 2025
Доступность за пределами контраста: цвет в инклюзивном дизайне
Доступность цвета — это не только коэффициенты контраста. Узнайте о принципе WCAG «не только цветом», индикаторах фокуса, состояниях ошибок и паттернах для людей с дальтонизмом.
Обновлено Окт 17, 2025
Цвета шелкографии: руководство для дизайнеров
Освойте техники цвета в шелкографии: цветоделение, растровые сетки, плашечные краски и подготовку макетов для шелкотрафаретной печати.
Обновлено Окт 14, 2025
Интерполяция цвета в CSS: почему побеждает OKLCH
Интерполяция цвета в CSS определяет, как градиенты и color-mix() смешивают цвета. Узнайте, почему OKLCH даёт яркие, равномерные результаты, а RGB и HSL — нет.
Обновлено Окт 12, 2025
Чеклист доступности цвета для веб-разработчиков
Полный чеклист доступности цвета для веб-разработчиков: коэффициенты контрастности WCAG, опора только на цвет, индикаторы фокуса, инструменты тестирования и автоматические проверки.
Обновлено Окт 07, 2025
Работа с цветом в JavaScript: библиотеки и техники
Освойте работу с цветом в JavaScript с помощью chroma.js, culori и tinycolor2. Разбирайте, трансформируйте и генерируйте цвета программно для веб-приложений.
Обновлено Окт 02, 2025
Цвет в веб-анимации: GSAP, Framer Motion и CSS
Освойте анимацию цвета в CSS, GSAP и Framer Motion. OKLCH-интерполяция, техники кейфреймов и оптимизация производительности.
Обновлено Сен 29, 2025
Пантонные и процессные цвета: руководство по печатному цвету
Разберитесь в различии между пантонными цветами и процессными цветами CMYK, когда использовать каждый из них, как они влияют на стоимость печати и как правильно подготовить файлы.
Обновлено Сен 27, 2025
Алгоритмы Контрастности: WCAG 2 против APCA
Как WCAG 2 и APCA (Advanced Perceptual Contrast Algorithm) вычисляют контрастность. Сравнение результатов и выбор подходящего метода для доступного дизайна.
Обновлено Сен 25, 2025
Система цвета SwiftUI: создание адаптивных цветовых палитр
Создавайте адаптивные цветовые палитры в SwiftUI. Изучите Color и UIColor, управление цветами в каталоге ресурсов, динамические цвета тёмного режима и паттерны цвета для доступности.
Обновлено Сен 19, 2025
Дизайн-токены для цвета: от Figma к коду
Реализация цветовых дизайн-токенов от Figma до продакшн-кода с помощью Style Dictionary. Именование токенов, трансформации и мультиплатформенный вывод.
Обновлено Сен 12, 2025
Соглашения об именовании цветов в CSS и дизайн-системах
Изучите CSS-именованные цвета, семантическое именование с кастомными свойствами, числовые шкалы в стиле Tailwind и лучшие практики управления именами цветов в командных дизайн-системах.
Обновлено Сен 06, 2025
Цвет в дизайне писем: что работает во всех почтовых клиентах
Как грамотно использовать цвет в email-письмах для Outlook, Gmail и Apple Mail. Безопасные стратегии, исправление тёмной темы и требования к инлайн-стилям.
Обновлено Сен 05, 2025
Тематизация цвета в React: CSS-переменные и Context
Постройте масштабируемую тематизацию цвета в React с помощью CSS-кастомных свойств и Context API. Охватывает архитектуру тем, Tailwind CSS-темы и стратегии мультибрендовости.
Обновлено Сен 03, 2025
Производительность веб-цвета: градиенты, тени и фильтры
Оптимизируйте производительность цвета в вебе. Узнайте, как градиенты, box-shadow, CSS-фильтры и backdrop-filter влияют на отрисовку и как ускорить их с помощью GPU.
Обновлено Сен 01, 2025
Адаптивный Цвет: Как Цвета Меняются на Разных Экранах
Как цвета меняются на разных дисплеях, цветовых гаммах и в тёмном режиме. CSS media queries и custom properties для адаптивных цветовых систем на любом экране.
Обновлено Авг 31, 2025
Цветовые Сочетания для Максимальной Читаемости Вывесок
Цветовые сочетания для читаемых вывесок, данные по видимости на расстоянии, требования ADA, LED и влияние материалов на восприятие цвета.
Обновлено Авг 30, 2025
Как выбрать фирменные цвета: пошаговое руководство
Пошаговое руководство по выбору фирменных цветов, резонирующих с вашей аудиторией. Охватывает исследование, анализ отрасли, психологию цвета, тестирование сочетаний и документирование брендбука.
Обновлено Авг 29, 2025