Нашли ошибку?

Генератор цветовой палитры

Строит палитру по базовому цвету по шести гармониям, показывает коды HEX, RGB и HSL и выгружает палитру в код и PNG.

Пробел — новый случайный цвет, когда курсор не в поле.

Гармония

Как строятся гармонии

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

  • Комплементарная: противоположный тон, поворот на 180°.
  • Аналоговая: соседние тона через 30° в обе стороны.
  • Триада: три тона через 120°.
  • Расщеплённая: два соседа противоположного тона, 150° и 210°.
  • Тетрада: четыре тона через 90°.
  • Монохромная: один тон разной светлоты.

Почему у серого нет гармонии

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

Другие инструменты

Специальные символы HTML

487 знаков в двенадцати разделах, с копированием щелчком

Визуальный HTML-редактор

Пишете как в текстовом редакторе — получаете готовый HTML

Код цвета HTML

Код цвета в HEX, RGB, HSL и HSB, с проверкой контраста

Эффект стекла в CSS

Стекло с проверкой читаемости надписи и запасным вариантом

Конвертер CSS в SCSS и обратно

CSS в SCSS со вложенностью и обратно, со сверкой результата

Конструктор сеток CSS Grid

Сетка под три экрана с готовым HTML и проверкой порядка блоков

Генератор CSS-градиентов

Градиент без серой середины, с проверкой читаемости текста

Генератор теней box-shadow

Тень слоями, с предпросмотром на двух фонах и проверкой видимости