Генератор палитры для тёмной темы
Создайте полную палитру (фоны, поверхности, тексты, акцент, состояния) для согласованного тёмного интерфейса на основе одного акцентного цвета. Оттенки рассчитываются полностью в вашем браузере.
Как это работает
Хороший тёмный интерфейс — это не просто инверсия чёрного и белого: фоны должны иметь лёгкий оттенок и никогда не быть полностью чёрными, чтобы избежать слишком резкого контраста, а акцент должен быть достаточно ярким, чтобы оставаться читаемым на тёмном фоне. Инструмент автоматически рассчитывает эти оттенки по тону вашего акцентного цвета в HSL и создаёт согласованный набор цветов, готовый к вставке в таблицу стилей в виде CSS-переменных.
Почему в тёмной теме лучше избегать полностью чёрного фона (#000000)?
Чистый чёрный в сочетании с чисто белым текстом создаёт предельный контраст, который утомляет глаза и вызывает эффект ореола (визуальную вибрацию) на некоторых OLED-экранах. Профессиональные тёмные интерфейсы (macOS, Material Design) используют очень тёмно-серые цвета с лёгким оттенком — именно это воспроизводит данная палитра.
Нужно ли адаптировать акцентный цвет к тёмной теме?
Да: акцентный цвет, хорошо смотрящийся на светлом фоне, может выглядеть блёклым или слишком тёмным на чёрном. Инструмент слегка осветляет заданный акцент, чтобы он сохранял хороший контраст и оставался хорошо заметным на созданных тёмных фонах.
Ни цвета, ни настройки не передаются на сервер: все расчёты цвета выполняются локально, в вашем браузере.