Полное руководство по цветовому кругу и подбору палитры цветов
Гармония цвета, комплементарные пары и ключевые различия между кругом Иттена и цифровым спектром RGB.
1. Что такое цветовой круг онлайн?
Цветовой круг онлайн — это фундаментальный ориентир для художников и дизайнеров. Разработанный на основе опытов Исаака Ньютона и систематизированный Иоганнесом Иттеном в школе Баухаус, круг упорядочивает оттенки по кругу, позволяя мгновенно определять сочетаемость.
Наш генератор помогает составить гармоничную палитру цветов для интерфейсов сайтов, брендинга, интерьеров и традиционной живописи.
2. Цветовой круг Иттена vs. RGB
| Базовый цвет | Противоположный в круге Иттена (RYB) | Противоположный в RGB | Тип |
|---|---|---|---|
| Красный (#E60026) | Зеленый (#00AA44) | Циан / Голубой (#00FFFF) | Основной (первичный) |
| Желтый (#FFE600) | Фиолетовый (#7A0099) | Синий (#0000FF) | Основной (первичный) |
| Синий (#002185) | Оранжевый (#FF6600) | Желтый (#FFFF00) | Основной (первичный) |
3. Комплементарные гармонии и одновременный контраст
Комплементарные (дополнительные) цвета расположены напротив друг друга под углом 180 градусов. В круге Иттена (RYB) пары Красный–Зеленый и Синий–Оранжевый усиливают взаимную яркость за счет одновременного контраста, помогая выделить ключевые акценты и кнопки интерфейса.
Хотите проверить, как выбранные на круге цвета смешаются как реальные краски? Перейти в симулятор смешивания цветов →
4. Пошаговая инструкция: как подобрать палитру на цветовом круге
Соберите сбалансированную и доступную цветовую схему за четыре шага:
- 1
Выберите модель круга (Иттен RYB или RGB)
Переключайтесь в 1 клик между классическим художественным кругом Иттена (Красный напротив Зеленого) и экранным RGB.
- 2
Укажите правило цветовой гармонии
Выберите комплементарную, аналоговую, триадную, тетрадную, сплит-комплементарную или монохромную схему.
- 3
Поверните маркер или введите HEX
Вращайте точку на круге или точно задавайте оттенок, насыщенность, светлоту и базовый HEX-код.
- 4
Проверьте контрастность и экспортируйте
Оцените показатели WCAG 2.1, режим симуляции дальтонизма и скачайте код для Tailwind CSS, CSS-переменных или SVG.
5. Для кого создан цветовой круг PigmentLab?
Универсальный инструмент для живописи, брендинга и веб-разработки:
Веб-дизайнерам и разработчикам
Создавайте 9-ступенчатые шкалы оттенков (50–900) и сразу копируйте токены Tailwind CSS и CSS-переменные.
Художникам и иллюстраторам
Используйте классические противоположные пары RYB школы Баухаус для живых контрастных работ.
Специалистам по инклюзивному дизайну
Проверяйте контраст по WCAG 2.1 и тестируйте палитру при 4 типах нарушения цветового зрения.
Преподавателям и студентам
Наглядно сравнивайте художественный цветовой круг Иттена и цифровой спектр RGB.
6. Преимущества цветового круга PigmentLab
- ✓Два движка в одном клике: классический круг Иттена (RYB) и цифровой RGB.
- ✓6 геометрических схем гармонии и шкала из 9 оттенков для каждого цвета.
- ✓Матрица контрастности WCAG 2.1 и симулятор дальтонизма в реальном времени.
- ✓Мгновенный экспорт в токены Tailwind CSS, CSS :root переменные и SVG.
- ✓Полностью бесплатно, без регистрации и с сохранением настроек в браузере.
Академические ссылки и спецификации
- Getty Research Institute: Теория цвета школы Баухаус ↗
Архивные материалы о системе цветового круга Иоганнеса Иттена и семи цветовых контрастах.
getty.edu - Справка об Иоганнесе Иттене и «Искусстве цвета» ↗
12-part Farbkreis (RYB) & Kunst der Farbe (1961).
en.wikipedia.org - W3C CSS Color Module Level 4 ↗
Официальная спецификация перцептивного пространства OKLCH и функции CSS color-mix().
w3.org - W3C Web Content Accessibility Guidelines (WCAG) 2.1 ↗
Международные пороги контрастности (AA 4.5:1 и AAA 7:1) для доступного дизайна.
w3.org
Часто задаваемые вопросы
Что такое цветовой круг онлайн и как им пользоваться?▼
Цветовой круг онлайн — это интерактивный инструмент, организующий видимый спектр в замкнутый геометрический круг 360°. Он помогает художникам, графическим дизайнерам и веб-мастерам создавать гармоничные палитры цветов: комплементарные (дополнительные), триады и аналоговые схемы.
В чем разница между кругом Иттена (RYB) и цифровым кругом RGB?▼
В классическом круге Иоганнеса Иттена (Баухаус) основными цветами являются Красный, Желтый и Синий, где Красный находится напротив Зеленого. В экранном круге RGB красный находится напротив бирюзового (циан). Круг Иттена отражает физическое смешивание красок.
Как подобрать дополнительные цвета?▼
Дополнительные (комплементарные) цвета расположены прямо напротив друг друга (на 180 градусов). Они создают максимальный зрительный контраст, привлекающий внимание к ключевым элементам интерфейса.
Как называется палитра цветов?▼
В дизайне и живописи упорядоченная палитра цветов называется цветовой схемой (гармонией) или цветовой гаммой. Главным инструментом для её составления служит цветовой круг (например, 12-частный круг Иоганнеса Иттена), группирующий первичные, вторичные и дополнительные оттенки.
Сколько цветов содержит палитра?▼
Классический спектральный цветовой круг Иттена содержит 12 основных цветов. Однако в прикладном дизайне и брендинге рабочая палитра обычно состоит из 3–5 ключевых цветов: доминирующего, вторичного, акцентного и нейтральных фоновых тонов.
Палитра цветов: как смешивать оттенки?▼
После составления гармоничной палитры на цветовом круге вы можете протестировать реальное смешивание выбранных оттенков в нашем онлайн-симуляторе красок PigmentLab, который точно рассчитывает физическое поглощение света.
Можно ли проверить контрастность по WCAG?▼
Да. Инструмент в реальном времени оценивает контрастность всех цветов палитры по стандарту WCAG 2.1 (AA и AAA) и моделирует восприятие дальтониками.