Мои инструменты

Генератор случайных цветов

Случайный цвет уже ждёт — нажмите пробел для следующего, копируйте HEX, RGB или HSL одним кликом.

Как пользоваться

  1. Цвет уже на экране при открытии страницы — для первого результата кликать не нужно.
  2. Нажмите пробел (или «Сгенерировать») для следующего цвета. Сначала выберите стиль, если нужен другой характер случайности: «Сбалансированный» остаётся в удобной середине пространства, «Везде» бросает по всему пространству HSL, «Яркий» и «Пастельный» целятся в акценты и мягкие фоны.
  3. Копируйте HEX, RGB или HSL его кнопкой — или нажмите на большой образец, чтобы скопировать HEX. «Копировать все три» кладёт в буфер все форматы, по одному в строке.

Пример

Настройки

Стиль «Сбалансированный»

Один из возможных результатов

HEX #A5B3C0
RGB rgb(165, 179, 192)
HSL hsl(210, 18%, 70%)

Значения случайны, поэтому именно эти вы не получите — проверьте форму: HEX это # и шесть шестнадцатеричных цифр, RGB три целых числа 0–255, HSL оттенок в градусах и два процента. Значки Aa на образце показывают, как читается чёрный и белый текст на этом цвете (контраст WCAG; 21:1 — лучший, 1:1 — невидимый).

Область применения, ограничения и частые вопросы

  • Только непрозрачные цвета: без alpha и 8-значного HEX. Для прозрачности вставьте значение в конвертер цветов.
  • Три формата: HEX, RGB и HSL. HSV, CMYK и другие цветовые пространства — задача конвертера цветов.
  • «Сбалансированный», «Яркий» и «Пастельный» — отобранные вручную удобные диапазоны в HSL, намеренно не математически равномерный выбор. Выберите «Везде» для равномерного броска по всему пространству HSL; грязные серые и почти белые входят в эту цену.
  • Случайность берётся из crypto.getRandomValues браузера — криптографически стойкая, но это не сервис «настоящей случайности» на атмосферном шуме.
  • Полоса недавних цветов живёт только в этом визите: перезагрузка её очищает. Ничего не загружается, не сохраняется и не попадает в URL, а кнопка «Поделиться» делится только ссылкой на страницу.
  • Значки Aa сравнивают цвет только с чёрным и белым текстом (относительная яркость WCAG 2.x). Другие цвета текста, наложения и управление цветом вне области применения.
  • Округление только на уровне отображения: перевод одного и того же цвета между HEX и HSL может сдвинуть канал на 1.

Что обычно нужно дальше, когда цвет уже под рукой.

Конвертер цветов

Генератор цветовых схем