Цветовой круг онлайн rgb: Подбор цветов и генерация цветовых схем

13.03.2023 Разное

Содержание

Подбор цветов и генерация цветовых схем

Монохроматическая модель. Эта цветовая схема основана на одном оттенке цвета, и использует вариации, сделанные только лишь изменением насыщенности и яркости.

Результат комфортен для глаз, даже при использовании агрессивных цветов. Вместе с тем, труднее найти диакритические знаки и основные факты.

Также монохроматические вариации сделаны для каждого цвета в других схемах.

Комплементарная (контрастная) модель. Основной цвет дополнен его комплементом (цвета на противоположной стороне цветового круга). Создается один холодный и один теплый цвет — вы должны рассмотреть, какой из них будет доминирующим, и должен ли дизайн выглядеть холодным, или теплым.

Не следует злоупотреблять контрастными цветами в дизайне, используйте их только как цветовой акцент.

Модель цветовой триады (мягкий контраст). Основной цвет дополнен двумя цветами, помещенными тождественно по обе стороны его комплемента. В отличие от «острого» контраста, эта цветовая схема зачастую является более комфортной для глаз, она мягче, и в ней больше пространства для балансировки теплых/холодных цветов.

Триада образована тремя цветами, равномерно распределяя цветовой круг (120°). Цветовые схемы триады имеют много возможностей по сочетанию цветов, регулировке контраста, акцентов и баланса теплых/холодных цветов.

Модель цветовой тетрады (двойной контраст). Эта цветовая схема образована парой цветов и их контрастов. Она основана на Тетраде — четверке цветов, равномерно распределенных по цветовому кругу (90°). Тетрада — очень агрессивная цветовая схема, требующая хорошего планирования и деликатный подход к отношениям этих цветов.

Меньшая дистанция между цветами вызывает в результате меньше напряжения. Тем не менее, тетрада всегда является более «нервной» и «вызывающей», чем другие цветовые схемы. Работая с ней, вы должны заботиться о связях между одним цветом и его смежным дополнительным цветом (комплементом). В случае тетрады (угол 90°), необходимо хорошее чувство цвета и очень деликатный подход к сочетанию цветов.

Модель аналогичных цветов. Эта цветовая схема образована основным цветом и его смежными цветами — два цвета, расположенные тождественно по обе стороны. Это всегда смотрится элегантно и четко, цветовая гамма в результате этого выглядит с меньшей напряженностью и равномерной колориметрией. Если выбран цвет на тепло-холодной границе, цвет с противоположной «температурой» может быть использован для акцентирования двух других цветов.

Вы можете задать дистанцию смежных (вторичных) цветов, угол не должен превышать 60°.

Модель акцентированной аналогии. Это аналогичная модель с добавлением дополнительного (контрастного) цвета. Модель должна рассматриваться как дополнение — она добавляет напряженности к цветовой палитре, и слишком агрессивна в случае злоупотребления. Вместе с тем, она может быть использована в некоторых деталях, а так же в качестве цветового акцента — порой получается очень эффективная и элегантная цветовая гамма.

Оттенок. На этой вкладке отображается цветовой круг. Кликните по ней для регулировки оттенков основных, дополнительных, и вторичных цветов.

Регулировка цветовой схемы. На этой вкладке можно регулировать яркость/насыщенность цвета и контраст цветовой схемы, или просто выбрать из предопределенных настроек.

Информация о цветовой схеме. Кликните по этой вкладке для отображения значений цветов фактической цветовой схемы, а так же для экспорта их в различные форматы данных.

Оттенок основного цвета. Чтобы изменить значения, перетащите ползунок по цветовому кругу. Для ввода числового значения, дважды кликните по нему.

Оттенок дополнительного цвета. Чтобы изменить значения, перетащите ползунок по цветовому кругу. Для ввода числового значения, дважды кликните по нему.

Оттенок вторичного цвета. Чтобы изменить угол/дистанцию, перетащите ползунок дальше или ближе от основного цвета. Для ввода числового значения, дважды кликните по нему.

Значение оттенка основного цвета. Кликните для ввода числового значения.

Угол/дистанция оттенка вторичных цветов. Кликните для ввода числового значения. Имеет смысл только в цветовых схемах, использующих вторичные цвета.

Значение RGB основного цвета. Кликните для ввода числового значения.

Будьте осторожны: из-за ошибки округления во время преобразования, значение RGB, используемое в цветовой схеме, может немного отличаться от введенного значения.

Значения RGB основного цвета.

Пресеты цветовых схем. Кликните и выберите предопределенные комбинации яркости, насыщенности и контрастности цветовой схемы.

Яркость и Насыщенность. Перетаскивайте ползунок по квадрату для регулировки яркости (вверх = светлее, вниз = темнее) и насыщенности (вправо = насыщенное, влево = разбавленное).

Контрастность цветовой схемы. Перетаскивайте ползунок по квадрату для регулировки контрастности вариантов цвета в схеме (вверх/вниз для темного варианта, влево/вправо для светлого варианта).

Контрастность цветовой схемы. Панель для регулировки яркости и насыщенности сразу всех вариантов схемы.

Коррекция Вариантов. Панель для регулировки яркости и насыщенности по отдельности для каждого цвета.

Список вариантов цвета. Выберите вариант цвета, а затем отрегулируйте его насыщенность и яркость при помощи ползунка на левом квадрате.

Схема палитры. Представлены четыре основных цвета, для легкого составления впечатления о схеме.

URL адрес цветовой схемы. Для каждой схемы существует уникальный ID. Вы можете сохранить эту ссылку в закладки, и вернуться к редактированию своей цветовой схемы в любой момент времени.

Предварительный просмотр цветовой палитры. Посмотрите, как выбранные цвета и их варианты сочетаются между собой.

Пример веб-страницы (светлая/позитив). Кликните чтобы посмотреть пример веб-страницы, созданной при помощи текущей цветовой схемы. Это только пример, цвета палитры могут использоваться в сотнях разных вариаций.

Пример веб-страницы (темная/негатив). Кликните чтобы посмотреть пример веб-страницы, созданной при помощи текущей цветовой схемы. Это только пример, цвета палитры могут использоваться в сотнях разных вариаций.

Показать пример текста. Отметьте галочку, чтобы отобразить белый, черный и серый текст в окне предварительного просмотра цветовой схемы.

Цвета HTML Color Цветовой круг

HTML5CSS.ru

ЛУЧШИЙ САЙТ ДЛЯ РАЗРАБОТЧИКОВ

❮ Назад Дальше ❯

Цветовой круг

Цветовой круг является наглядной организацией цветов вокруг окружности, Отображение связей между основными цветами, дополнительными цветами и третичными цветами.

Три важных колеса цвета

Сколько способов можно переставить радугу?

RGB

Red, Green, Blue

CMY

Cyan, Magenta, Yellow

RYB

Red, Yellow, Blue

Цветное колесо RGB

Цветовой круг RGB (красный, зеленый, синий) представляет собой 3 источника света, используемые для производства цветов на экране телевизора или компьютера.

Основные цвета: красный, зеленый и синий.

Вторичные цвета создаются путем смешивания основных цветов:

Красный и зеленый = желтый
Зеленый и синий = голубой
Синий и красный = пурпурный

12 основных цветов RGB:

RED #FF0000 (255,0,0)	#FF8000 (255,128,0)	YELLOW #FFFF00 (255,255,0)	#80FF00 (128,255,0)	GREEN #00FF00 (0,255,0)	#00FF80 (0,255,80)
CYAN #00FFFF (0,255,255)	#0080FF (0,128,255)	BLUE #0000FF (0,0,255)	#8000FF (128,00,255)	MAGENTA #FF00FF (255,0,255)	#FF0080 (255,0,128)

Зеленый цвет RGB отличается от цвета HTML с именем Green.

CMY (K) цвет колеса

CMY (K) (голубой, пурпурный, желтый) представляют цвета, используемые для печати на бумаге.

Основные цвета: голубой, пурпурный и желтый.

Вторичные цвета создаются путем смешивания основных цветов:

Голубой и пурпурный = синий
Пурпурный и желтый = красный
Желтый и голубой = зеленый.

12 основных цветов CYM:

CYAN #00FFFF (0,255,255)	#0080FF (0,128,255)	BLUE #0000FF (0,0,255)	#8000FF (128,00,255)	MAGENTA #FF00FF (255,0,255)	#FF0080 (255,0,128)
RED #FF0000 (255,0,0)	#FF8000 (255,128,0)	YELLOW #FFFF00 (255,255,0)	#80FF00 (128,255,0)	GREEN #00FF00 (0,255,0)	#00FF80 (0,255,80)

Подробнее о CMYK.

Колесо цвета синтез системе RYB

Синтез системе RYB (красный, желтый, синий) цвет колеса используется художников, художников и дизайнеров для смешивания пигмента цветов.

3 основных цвета красный, желтый и синий.

Вторичные цвета создаются путем смешивания основных цветов.

3 вторичных цвета оранжевый, зеленый и фиолетовый.

Красный и желтый = оранжевый
Желтый и синий = зеленый
Синий и красный = фиолетовый.

Третичные цвета изготавливаются путем смешивания двух вторичных цветов.

6 третичных цветов красно-оранжевый, желтый-оранжевый, желтый-зеленый, сине-зеленый, сине-фиолетовый, красно-фиолетовый

12 основных цветов синтез системе RYB:

RED #FE2712	R-O #FC600A	ORANGE #FB9902	Y-O #FCCC1A	YELLOW #FEFE33	Y-G #B2D732
GREEN #66B032	B-G #347C98	BLUE #0247FE	B-P #4424D6	PURPLE #8601AF	R-P #C21460

Синтез системе RYB является лучшим цветовым колесом, чтобы определить цвета, которые хорошо сочетаются друг с другом.

Синтез системе RYB колесо может быть использовано для создания приятных цветовых схем для Интернета.

Вы узнаете больше о цветовых схемах в главе Цветовые схемы.

❮ Назад Дальше ❯

PHP\CSS\JS\HMTL Editor

Как сделать

Вкладки
Выпадающие
Аккордеоны
Конвертер
Анимированные кнопки
Боковая Навигация
Верхняя навигация
Модальные коробки
Строки хода выполнения
Параллакс
Форма входа
HTML вставка
Google Карты
Ползунки диапазона
Подсказки
Слайдшоу
Список фильтров
Сортировать список

Еще »

Правила и Условия Политика конфиденциальности О нас Контакты

Цветовой круг — Калькулятор цвета

Годы вдохновляющего онлайн-обучения искусству и дизайну

ЗАПРОСИТЬ ИНФОРМАЦИЮ

ЗАРЕГИСТРИРОВАТЬСЯ СЕЙЧАС

Независимо от того, разрабатываете ли вы логотип или красите дом, выбор цвета может быть сложным. С чего начать? Какие цвета сочетаются друг с другом и почему? Как вы можете творчески исследовать разные настроения или направления?

Используйте бесплатный калькулятор цвета , чтобы исследовать творческие варианты цвета для вашего дизайнерского проекта. Просто выберите базовый цвет (цвета), выберите цветовую гармонию, настройте/исследуйте по мере необходимости и посмотрите результаты. Вы получите отчет о значениях цвета в шестнадцатеричном формате, RGB и CMYK для вашего проекта и увидите, как ваши цвета применяются к образцам дизайна. Поделитесь или распечатайте, промойте и повторите.

Lock

Выберите цвет

Снимите удалить добавить больше

Выберите Harmony

См. Результаты

Clear Add Add

RYB Modergb Режим

Как использовать | Что такое цветовой круг? | Разработка цветовой схемы

Как ее использовать

1.

Выберите цвет.

Щелкните первое поле, чтобы открыть палитру цветов, и проведите пальцем, чтобы выбрать нужный оттенок (например, красный, фиолетовый или синий). Перетащите точку вправо и влево, чтобы отрегулировать насыщенность, или вверх и вниз, чтобы отрегулировать значение.

Если вы знаете шестнадцатеричные значения, значения RGB или CMYK для вашего основного цвета, введите их в соответствующие поля. Щелкните плюс, чтобы добавить до трех основных цветов

2. Выберите гармонию.

Выберите одну из шести цветовых комбинаций для работы с начальным цветом. Щелкните символ цветовой гармонии, чтобы завершить цветовую схему.

3. См. результаты.

Цвета, составляющие вашу гармонию, будут отображаться в образцах калькулятора цветов и на интерактивном цветовом круге.

Настройте или исследуйте эти варианты, выбирая и сравнивая различные гармонии, просматривая одну и ту же гармонию с разными цветами, регулируя насыщенность или значение или добавляя дополнительные входные цвета. Очистить все, чтобы начать сначала.

Нравится то, что вы видите? Создайте цветовую схему , чтобы просмотреть отчет о цвете и сохранить шестнадцатеричные цвета, цвета RGB и CMYK для веб-проектов или проектов печати.

Посмотрите, как ваш образец применяется к образцам дизайна. Распечатайте страницу, сохраните ее в формате PDF, поделитесь ею с друзьями и семьей. Это красочный мир.

Sessions College – Color Theory: Color Wheel

Что такое Color Wheel?

Цветовой круг представляет собой диаграмму, отображающую отношения между цветами. На основе круга, показывающего цвета спектра, первоначально созданного сэром Исааком Ньютоном в 1666 году, 9Созданный им цветовой круг 0075 сегодня служит многим целям. Художники используют его для определения цветов для смешивания, а дизайнеры используют его для выбора цветов, которые хорошо сочетаются друг с другом.

Классический цветовой круг показывает оттенки, расположенные по кругу, соединенные линиями или фигурами. Цвета включают первичные цвета (красный, желтый и синий), вторичные цвета (оранжевый, зеленый и фиолетовый) и третичные цвета (желто-зеленый, сине-зеленый, сине-фиолетовый, красно-фиолетовый, красно-оранжевый и желто-оранжевый). цвета создаются путем смешивания основных цветов. Например, смешивание красного и желтого дает оранжевый; смешивание желтого и синего дает зеленый.

Информационный бюллетень NOD

Хотите получать больше ресурсов, советов и новостей по дизайну на свой почтовый ящик? Подпишитесь на наш информационный бюллетень Notes on Design, блог Sessions College, посвященный искусству и дизайну.

Разработка цветовой схемы

Дизайнеры часто начинают проект с разработки цветовой схемы : набора цветов, которые будут хорошо сочетаться друг с другом для клиента или выполняемой задачи. Хотя иногда вы начинаете с нуля, обычно вы начинаете с одного или двух базовых цветов, а другие цвета будут построены.

Основы цветовой гармонии Как выбрать цвета, которые действительно работают? Используйте цветовой круг (или наш цветовой калькулятор), чтобы определить гармоничные цветовые сочетания. Следующие цветовые гармонии основаны на геометрических соотношениях на цветовом круге. По этой причине мы можем представить их в виде фигур. Вращайте эти фигуры вокруг центральной точки цветового круга, чтобы создавать безграничные цветовые комбинации.

Дополнительные цветовые схемы используют два противоположных цвета на цветовом круге.

Монохроматические цветовые схемы используют три разных значения одного и того же цвета.

Аналогичные цветовые схемы используют три соседних цвета на цветовом круге.

Разделенные дополнения используют цвет и два смежных третичных цвета его дополнения.

Цветовые схемы Triadic используют три равномерно расположенных цвета на цветовом круге.

Цветовые схемы Tetradic используют две дополнительные пары.

Выбор правильных цветов Выбор правильных цветов требует большого творчества и экспериментов. Имейте в виду, что цвет очень психологичен, и разные цветовые гармонии производят разные эффекты. Например, аналогичные цвета похожи по оттенку, создавая плавный переход от одного цвета к другому. Дополнительные цвета расположены напротив друг друга на цветовом круге, поэтому они создают сильный контраст. Монохроматические цветовые схемы могут быть тонкими и изысканными.

Например, в этом развороте из журнала Martha Stewart аналогичная цветовая схема создает плавный переход от желтого к желто-зеленому и зеленому. Это приятно для глаз.

Экспериментируйте с различными гармониями для достижения желаемого настроения или эффекта.

Настройка значения цвета и насыщенности После того, как вы выбрали цвета, вы можете настроить значение определенного цвета или цветов — насколько светлым или темным будет цвет.

Или вы можете отрегулировать его насыщенность, насколько она богата. Каждый оттенок на цветовом круге онлайн имеет различную внутреннюю ценность. Желтый, например, светлее синего.

В этой цветовой схеме розовые и оранжевые оттенки являются самыми светлыми, контрастируя с темными буквами.

Чтобы увеличить контрастность цветовой схемы, вам может потребоваться настроить значение определенного цвета, например, сделав желтый темнее или светлее. Или, возможно, отрегулируйте насыщенность, чтобы изменить интенсивность. Вы можете сделать и то, и другое, используя калькулятор цвета.

RGBA Color Picker

Новинка: Color Code Finder: Инструмент для подбора цветов с изображений!

rgba(245, 40, 145, 0.8)

Цветовое пространство RGB

Цветовое пространство — это математическая модель, используемая для представления физических цветов. Цветовое пространство RGB представляет собой цветовое пространство, состоящее из трех каналов: красного, зеленого и синего, представляющих трехмерную информацию о цвете.

Каждый канал представлен 8 битами, а значение каждого канала представляет собой значение от 0 до 255.

Цветовое пространство RGB представляет собой комбинацию компонентов красного, зеленого и синего света аддитивного цвета. Компоненты RGB представлены математической моделью:

 R = красный (0 ≤ R ≤ 255)
G = зеленый (0 ≤ G ≤ 255)
B = синий (0 ≤ B ≤ 255)

В цветовом пространстве RGB интенсивность света каждого канала равна значению каждого канала. Например, если для каждого канала задано значение 255, цвет визуализируемого цветового пространства будет белым. Кроме того, если значение каждого канала установлено на 0, цвет визуализируемого цветового пространства становится черным.

Одинаковые значения каждого канала представлены одним и тем же цветом в цветовом пространстве RGB, но сочетание разных значений каждого канала приводит к разным цветам. Цветовое пространство RGB используется для расчета цвета каждого пикселя, который может отображаться на экране.

RGB 565 — это альтернативное представление цветов RGB, в котором для представления цвета используется 16 бит: 5 бит для красного, 6 бит для зеленого и 5 бит для синего. Это цветовое пространство используется в некоторых встроенных системах, таких как микроконтроллеры. Чтобы выбрать цвета RGB 565, воспользуйтесь нашей палитрой цветов RGB 565.

RGB 0-1 или Float RGB — это еще одно альтернативное представление цветов RGB, в котором для представления цвета используются три десятичных числа от 0 до 1: по одному для красного, зеленого и синего и одно для дополнительного альфа-канала. Чтобы выбрать цвета RGB 0-1, воспользуйтесь нашей палитрой цветов RGB 0-1.

Цветовое пространство RGBA

Цветовое пространство RGBA — это цветовое пространство, включающее дополнительный канал (альфа-канал) для представления информации о прозрачности изображения. Цвет RGBA состоит из четырех каналов, каждый из которых представлен 8 битами. В RGBA информация о прозрачности хранится в альфа-канале, а информация о цвете хранится в трех каналах RGB.

Альфа-канал может отображаться как изображение в градациях серого. Это означает, что альфа-канал состоит из 256 уровней прозрачности, где 0 представляет максимальный уровень прозрачности, а 255 — максимальный уровень непрозрачности.

В цветовом пространстве RGBA альфа-канал считается таким же, как четвертый канал, а интенсивность света каждого канала равна значению каждого канала. Например, если для каждого канала задано значение 255, цвет визуализируемого цветового пространства будет белым. Кроме того, если значение каждого канала установлено на 0, цвет визуализируемого цветового пространства становится черным.

Одинаковые значения каждого канала представлены одним и тем же цветом в цветовом пространстве RGBA, но сочетание разных значений каждого канала приводит к разным цветам.

Цветовое пространство RGBA используется для расчета цвета каждого пикселя, который может отображаться на экране. Кроме того, можно получить доступ к альфа-каналу, чтобы сделать изображение прозрачным. Это означает, что если альфа-канал имеет значение 255 (непрозрачный), он не представляет собой прозрачный пиксель.

Другие цветовые пространства

В дополнение к цветовым пространствам RGB и RGBA существуют другие цветовые пространства, которые широко используются в программировании:

CMYK : Цветовое пространство CMYK — это цветовое пространство, используемое для печати. Это цветовое пространство, состоящее из четырех каналов, где каждый канал представлен 8 битами. Цветовое пространство CMYK является субтрактивным цветовым пространством, в котором цвет каждого канала создается путем вычитания цвета одного канала из остальных каналов. По крайней мере, один из каналов черный, и цвет этого канала известен как ключевой цвет. Другие каналы представляют собой цвета, смешанные с основным цветом, и цвет каждого канала определяется количеством смешанного ключевого цвета.

HSV : Это цветовое пространство используется для представления цвета одного оттенка.

Comments

Leave Comment