Бесплатен Извлекувач на палета на бои од слика

Како функционира

Извлекувањето бои работи целосно во вашиот прелистувач користејќи рачно напишан алгоритам за групирање k-means++ применет на сурови податоци за пиксели прочитани од Canvas API — без сервер, без библиотека од трета страна. Истата слика и поставки за број на бои секогаш произведуваат иста палета бидејќи алгоритмот користи детерминистички псевдослучаен генератор на броеви (mulberry32) наместо Math.random.

1. 1
   Canvas ги чита податоците за пиксели

   Сликата се исцртува на невидлив HTML Canvas елемент и се намалува до најмногу 200px на нејзината најдолга страна. getImageData() на Canvas API враќа секој пиксел како сурови RGBA бајти, а целосно проѕирните пиксели (алфа < 128) се отфрлаат пред да започне групирањето.
2. 2
   k-means++ ги групира пикселите

   Иницијализатор k-means++ детерминистички ги поставува центроидите, потоа алгоритмот итерира до 20 пати: секој пиксел се доделува на неговиот најблизок центроид во RGB просторот, потоа центроидите се препресметуваат како средна вредност на сите доделени пиксели. Групите што се собираат на истата хекс вредност се спојуваат, така што секое поле во резултатот е уникатно.
3. 3
   Се пресметуваат метаподатоци по боја

   Секој центроид се конвертира во HEX, HSL, и неговиот удел во вкупните пиксели (процент). WCAG релативна луминозност се пресметува според стандардната формула, а односите на контраст наспроти црно и бело се прикажуваат заедно со секое поле.
4. 4
   Извоз и излез со капалка за боја

   Палетата може да се копира како прилагодени CSS својства, SCSS променливи, испечаток на Tailwind конфигурација, или JSON. Капалка за земање примерок со кликнување го пресликува вашето кликнување на прегледот назад на точните изворни координати на пиксел на платно со целосна резолуција, додавајќи ја бојата на тој пиксел на посебна листа на избрани бои. PNG лента со палета може да се преземе преку Canvas toBlob().

Поврзани алатки