Utilia

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

Генерирайте случайни цветове или хармонични палитри, заключвайте харесаните, копирайте кодове HEX, RGB или HSL и ги експортирайте като CSS, SCSS, JSON.

Нюанс (°)
Наситеност (%)
Светлина (%)

Заключете цветовете, които харесвате, после генерирайте отново, за да се заменят само останалите.

Цветове

    Как да използвате генератора на случайни цветове

    1. Задайте Брой цветове (от 1 до 20).
    2. Изберете Режим: - Случайни в диапазон тегли всеки цвят независимо. Стеснете диапазоните Нюанс (°), Наситеност (%) и Светлина (%) с полетата „от“ и „до“, за да останете в рамките на семейство цветове, например само пастелни или само сини. - Хармонична палитра (OKLCH) тегли един случаен основен цвят и изгражда останалите по цветова хармония. Изберете Хармония (Допълващи се, Аналогови, Триадни, Разделени допълващи, Тетрадни, Квадрат, Монохроматични) или оставете Изненадай ме, за да получавате различна хармония всеки път.
    3. Щракнете върху Генерирай цветове. Всяка карта показва цвета с неговите кодове HEX, RGB и HSL; малките бутони HEX, RGB и HSL копират съответния код.
    4. Щракнете върху Заключи при цветовете, които искате да запазите, после отново Генерирай цветове: променят се само незаключените цветове. Щракнете пак върху бутона, за да отключите цвят.
    5. Изберете формат в Експортирай като (Списък HEX, CSS променливи, SCSS променливи, JSON масив или Цветове за Tailwind) и използвайте Копирай или Изтегли, за да вземете целия набор със себе си.

    Как се избират цветовете

    В режим Случайни в диапазон нюансът, наситеността и светлината се теглят равномерно в зададените от вас диапазони и после се преобразуват от HSL в RGB със същата формула, която браузърите използват за hsl(). Диапазонът на нюанса може да обхваща червеното: от 330 до 30 дава розови, червени и оранжеви цветове, минавайки през 0°. Няколко полезни настройки:

    • Пастелни: наситеност 40–80%, светлина 75–90%.
    • Тъмни, приглушени тонове: наситеност 10–40%, светлина 15–35%.
    • Само сини: нюанс 190–250.
    • Топли цветове: нюанс от 330 до 60.

    В режим Хармонична палитра (OKLCH) инструментът работи в OKLCH – перцептивен цветови модел, в който равните стъпки на светлината изглеждат равни за окото. Първият заключен цвят се използва като основа; ако нищо не е заключено, се тегли случайна основа със средна светлина и доста наситена. Останалите цветове вземат ъглите на нюанса на хармонията (например +120° и +240° за триадна), с малко случайно отклонение в нюанса, светлината и наситеността, така че всяко щракване дава нов резултат. Когато поискате повече цветове, отколкото нюанси има хармонията, допълнителните цветове използват отново ъглите с по-светли и по-тъмни варианти. Монохроматичната запазва един нюанс и разпределя светлината от тъмно към светло.

    Цветовете, които излизат извън обхвата на sRGB екран, се връщат в него чрез намаляване на наситеността им, така че всеки HEX код, който копирате, е истински цвят, който може да се покаже.

    Къде помагат случайните цветове

    Случайните цветове са удобни за примерни аватари и диаграми, тестови данни, генеративно изкуство, търсене на идеи в дизайна, когато сте пред бял лист, или за избор на цвят за проект, отбор в игра или етикет. Заключването ви позволява да го ползвате като слот машина: запазете каквото върши работа, завъртете останалото. Случайността идва от криптографския генератор на браузъра ви и нищо не се изпраща никъде.

    Често задавани въпроси

    Как да получа случаен HEX код на цвят?

    Задайте Брой цветове на 1 и щракнете върху Генерирай цветове, после щракнете върху бутона HEX, за да копирате кода, например #3A7BD5.

    Мога ли да запазя някои цветове и да генерирам останалите отново?

    Да. Щракнете върху Заключи при всеки цвят, който искате да запазите, после върху Генерирай цветове. Заключените цветове остават на място; в режим на хармония първият заключен цвят става и основа на новата палитра.

    Защо да ползвам режима на хармония в OKLCH, а не чисто случайни цветове?

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

    Какво съдържат форматите за експорт?

    Списък HEX дава по един код на ред, CSS и SCSS променливите дават декларации --color-1 или $color-1, JSON масивът дава списък с кодове, а Цветове за Tailwind дава обект colors с ключове 100, 200… за вашата конфигурация.

    Наистина ли са случайни цветовете?

    Идват от crypto.getRandomValues – криптографски сигурния генератор на браузъра, така че никакъв шаблон не се повтаря между щракванията.