Prevažujúca farba obrázka
Zistite dominantnú farbu ľubovoľného obrázka a paletu jeho najčastejších farieb. Nástroj rozdelí každý viditeľný pixel do jedného z 4096 farebných intervalov, za dominantnú farbu označí interval s najväčším počtom pixelov, vypíše až 12 farieb palety s ich podielom na obrázku a pridá celkovú priemernú farbu; všetky hodnoty sú uvedené vo formáte hex, RGB a HSL. Užitočné pre dizajnérov, tvorcov tém a vývojárov, ktorí potrebujú zástupné alebo zvýrazňujúce farby.
Často kladené otázky
Ako sa určuje dominantná farba?
Každý pixel sa zaradí do jedného z 4096 intervalov, pričom každý kanál červenej, zelenej a modrej má 16 úrovní. Vyhrá interval s najväčším počtom pixelov a jeho farbou je priemer pixelov v ňom, takže pri bielom pozadí sa zobrazí čistá biela, nie zaokrúhlená hodnota.
Čo je paleta?
Paleta uvádza najčastejšie intervaly po dominantnom intervale, a to až do počtu farieb, ktorý si zvolíte v rozsahu od 1 do 12; predvolená hodnota je 5. Pri každej položke sa zobrazuje hodnota hex, RGB a HSL aj podiel viditeľných pixelov, ktoré pokrýva.
Ako sa priemerná farba líši?
Priemerná farba je priemer všetkých viditeľných pixelov. Na fotografii modrej oblohy nad červeným poľom môže byť dominantná modrá alebo červená, no priemerná farba bude tlmenou zmesou oboch. Priemerná farba sa hodí na rozmazané zástupné obrázky, zatiaľ čo dominantná farba na zvýraznenie.
Ako sa spracúvajú priehľadné pixely?
Pixely s priehľadnosťou vyššou ako polovica sa ignorujú, takže pri logu na priehľadnom pozadí sa zobrazia farby loga namiesto čiernej. Výsledok uvádza, aký podiel obrázka bol priehľadný. Ak obrázok neobsahuje žiadne viditeľné pixely, zobrazí sa správa namiesto farby.
Ktoré formáty môžem analyzovať?
Podporované sú obrázky JPEG, PNG, GIF, WebP, TIFF a AVIF s veľkosťou do 5 MB. Pri animovaných súboroch GIF a WebP sa meria prvý snímok a obrázky CMYK sa pred počítaním prevedú do sRGB.
Zmenšujú sa najprv veľké obrázky?
Obrázky, ktoré majú na jednej strane viac ako 4000 pixelov, sa pred počítaním zmenšia tak, aby sa zmestili do 4000 pixelov. Podiely sa tým zmenia nanajvýš nepatrne. Menšie obrázky sa počítajú pixel po pixeli.
Prečo sa podobné odtiene zobrazujú ako samostatné farby?
Intervaly majú šírku 16 úrovní, takže dva odtiene po opačných stranách hranice intervalu sa počítajú samostatne. Preto sa pri gradientoch a fotografiách v palete často zobrazujú susediace odtiene. Ak chcete zobraziť viac odtieňov, zvýšte počet farieb v palete.
Môžem farby použiť v CSS?
Áno. Každá farba je k dispozícii ako hex kód, napríklad #3366cc, ako hodnoty rgb() a ako hodnoty hsl(), kde je odtieň v stupňoch a sýtosť aj svetlosť v percentách. Môžete ich skopírovať do CSS, dizajnových nástrojov alebo nastavení témy.
Na čo môžem použiť dominantnú farbu?
Medzi bežné použitia patria zástupné pozadia počas načítavania obrázkov, zvýrazňujúce farby kariet a hlavičiek zladené s titulným obrázkom, triedenie produktových fotografií podľa farieb a kontrola, či obrázky značky dodržiavajú farebnú paletu. Štruktúrovaný výsledok tiež uľahčuje opätovné použitie hodnôt v skriptoch a témach.
Je výsledok vždy rovnaký?
Áno. Počítanie je deterministické, takže rovnaký súbor vždy poskytne rovnakú dominantnú farbu, paletu a podiely. Ak majú dva intervaly presne rovnaký počet pixelov, ich poradie určí poradie, v ktorom sa ich farby prvýkrát objavia.