Генератор на цветни палитри — безплатно

Как работи

Инструментът е изграден без външни библиотеки — цялата цветова математика работи в ръчно написан JavaScript директно във вашия браузър. Той преобразува избрания от вас цвят между шестнадесетично и HSL, след което прилага класически правила за хармония от теорията на цвета (допълващи, триадни, аналогови и т.н.) чрез аритметика върху цветовия кръг, за да произведе всяка палитра.

1. 1
   Преобразуване от шестнадесетично в HSL

   Когато изберете цвят, инструментът анализира шестнадесетичния низ в RGB компоненти и ги преобразува в HSL (тон, наситеност, светлина). Тонът е позицията от 0 до 360 градуса на цветовия кръг; цялата палитрова математика се извършва в това пространство.
2. 2
   Аритметика на тона за хармония

   Всеки тип палитра е фиксирана формула на завъртане, приложена към базовия тон. Допълващата добавя 180°, триадната добавя 120° и 240°, тетрадната стъпва на 90°, разделено-допълващата използва 150° и 210°. Монохромната и нюансите запазват тона и наситеността постоянни, докато стъпват светлината нагоре и надолу.
3. 3
   Изход от HSL в шестнадесетично

   Всяка изчислена HSL тройка се преобразува обратно в шестнадесетичен цвят чрез стандартната формула за цветност. Резултатите се показват като цветна лента с автоматично контрастирани етикети (тъмен текст на светли плочки, светъл текст на тъмни) определени от прост праг на яркостта.
4. 4
   Експортирайте в предпочитания от вас формат

   Палитрата може да бъде копирана като шестнадесетични низове или експортирана като файл с CSS променливи (:root { --color-1: … }), SCSS променливи, откъс от конфигурация на Tailwind, JSON обект или PNG цветна лента. Експортът в PNG използва Canvas API на браузъра (toDataURL), за да изчертае всяка плочка с нейния шестнадесетичен етикет — всичко се генерира локално при кликване.

Свързани инструменти