Генератор оттенков цвета

Это три классических способа изменить цвет, сохраняя его узнаваемый оттенок. Shade смешивает цвет с чёрным, делая его темнее. Tint смешивает его с белым, делая светлее и мягче. Tone смешивает его с серым, приглушая без сдвига к чистому чёрному или белому. Этот инструмент создаёт все три как 11-ступенчатую полосу, от исходного цвета до 0%.

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

Дополнительный поворачивает только оттенок на 180° по цветовому кругу, сохраняя ту же насыщенность и яркость, поэтому яркий красный становится столь же ярким голубым - это «противоположный цвет», используемый в теории цвета и дизайне. Инвертированный же переворачивает каждое значение красного, зелёного и синего (255 минус исходное), что также меняет яркость: белый становится чёрным при инверсии, но остаётся белым при дополнительной операции, поскольку нет оттенка для поворота.

Триадная схема выбирает ещё два цвета, равномерно расположенных с шагом 120° на цветовом круге, давая три цвета с сильным контрастом, которые всё же ощущаются сбалансированными вместе. Аналоговая схема выбирает цвета на 30° по обе стороны от вашего оттенка, цвета, расположенные рядом друг с другом на круге и естественно выглядящие гармонично. Монохромная схема сохраняет точный оттенок и насыщенность вашего цвета, но изменяет только светлоту, давая набор цветов, гарантированно сочетающихся, поскольку это на самом деле один и тот же цвет на разных уровнях яркости.

216 web-safe цветов - это палитра, которая отображалась одинаково на старых 256-цветных дисплеях, каждый канал красного, зелёного, и синего ограничен одним из шести значений (0, 51, 102, 153, 204, 255). Современным экранам это ограничение не нужно, но web-safe эквивалент всё ещё полезен как справка для ретро-стилизации или крайне ограниченного цветового вывода.

HSL, HSV, и CMYK все описывают один и тот же цвет через разные модели, созданные для разных целей. HSL и HSV оба описывают оттенок, и разница между "значением" HSV и "светлотой" HSL означает, что один и тот же цвет может показывать разный процент насыщенности между ними. CMYK описывает, сколько голубых, пурпурных, жёлтых, и чёрных чернил смешал бы принтер, что следует правилам вычитающего цвета вместо правил аддитивного красного, зелёного, и синего света, которые используют RGB и HSL/HSV, поэтому это не простое прямое преобразование.

Да. Нажмите на любой hex-код в строке Значения цвета, в любом образце оттенка, тона, тональности, или цветовой схемы, чтобы скопировать его в буфер обмена. В разделе CSS-код внизу есть готовые правила background-color, color, border-color, и box-shadow со своими кнопками копирования.