Barevná paleta prohledá každý element na webové stránce a extrahuje kompletní sadu použitých barev — od textu a pozadí po rámečky, stíny a akcenty. Barvy jsou zobrazeny jako vizuální vzorníky seřazené podle frekvence (nejpoužívanější první), každý ukazující hodnotu HEX a počet použití. Kliknutím na libovolný vzorník ho zkopírujete nebo exportujte celou paletu jako seznam barevných kódů.
Každá dobře navržená webová stránka má konzistentní barevnou paletu — obvykle 3–8 primárních barev plus některé neutrály. Barevná paleta tuto paletu automaticky extrahuje prohledáváním vypočítaných hodnot color, background-color, border-color a box-shadow každého elementu. Výsledkem je sbírka seřazená podle frekvence pro každou barvu na stránce, dávající vám kompletní obrázek o barevném systému stránky. Dominantní barvy (primární barva značky, barva pozadí, barva textu) se zobrazují jako první s vysokými počty použití. Akcentní barvy a jednorázové hodnoty se zobrazují dále. To je neocenitelné pro designový výzkum — navštivte libovolnou webovou stránku a extrahujte její přesnou barevnou paletu za sekundy. Je to také užitečné pro audit vlastní stránky: jsou tam cizí barvy, které nepatří do vašeho designového systému? Používáte 5 mírně odlišných odstínů šedé, když designová specifikace definuje pouze 3? Barevná paleta zpřístupní a spočítá celé použití barev.
Prohledá každý viditelný element na stránce a extrahuje barvy z vypočítaných vlastností: color, background-color, border-color, barva box-shadow, outline-color a text-decoration-color. Každá barva použitá na stránce je zachycena.
Barvy jsou seřazeny podle počtu použití — nejpoužívanější barva se zobrazuje jako první. Dominantní barvy značky a pozadí se vyšplhají na vrchol, zatímco jednorázové akcentní barvy se zobrazí jako poslední. Okamžitě uvidíte primární, sekundární a akcentní barvy stránky.
Každá barva je vykreslena jako velký vizuální vzorník s níže zobrazeným HEX kódem a počtem použití. Vzorníky jsou dostatečně velké pro rozlišení jemných barevných rozdílů (jako #333 vs #2a2a2a).
Kliknutím na libovolný vzorník barvy okamžitě zkopírujete hodnotu HEX do schránky. Není třeba otevírat panel barev nebo sekundární dialog — jedno kliknutí, zkopírováno, hotovo.
Kliknutím na Exportovat vše zkopírujete celou paletu jako formátovaný seznam HEX barevných kódů. Vložte do designového nástroje, souboru CSS proměnných nebo barevné dokumentace. Seznam zachovává pořadí řazení podle frekvence.
Barvy jsou normalizovány (reprezentace rgb a hex stejné barvy jsou sloučeny) a deduplikovány. Paleta zobrazuje pouze jedinečné barvy s kombinovanými počty použití pro duplicitní reprezentace.
Navštivte webové stránky s krásnými barevnými schématy a extrahujte jejich přesnou paletu. Použijte barvy jako výchozí bod pro vlastní design — nebo jednoduše zdokumentujte, které barevné kombinace dobře fungují dohromady.
Spusťte Barevnou paletu na vlastní stránce pro ověření konzistence barev značky. Jsou tam 4 mírně odlišné modré, kde by měla být 1? Pronikají off-brand barvy? Řazení podle frekvence dělá nekonzistence zřejmými.
Exportujte paletu a převeďte ji na vlastní vlastnosti CSS (--color-primary, --color-secondary atd.). Výstup seřazený podle frekvence vám říká, které barvy si zaslouží primární, sekundární a akcentní role.
Extrahujte barevné palety z webových stránek konkurentů pro pochopení jejich brandového umístění. Teplé barvy vs studené barvy, vysoký kontrast vs tlumené — paleta odhaluje záměrné designové volby.
Podívejte se na všechny barvy textu vedle barev pozadí. Jsou nějaké kombinace text-pozadí příliš nízkého kontrastu? Paleta vám dá kompletní sadu barev pro kontrolu oproti požadavkům kontrastu WCAG.
Otevřete plovoucí dok DevSuite Pro a klikněte na ikonu Barevné palety. Nástroj prohledá každý element na stránce a extrahuje všechny hodnoty barev.
Zobrazí se mřížka vzorníků barev seřazených podle frekvence použití. Nejpoužívanější barvy jsou nahoře. Každý vzorník zobrazuje HEX kód a počet elementů používajících tuto barvu.
Kliknutím na libovolný vzorník zkopírujete hodnotu HEX do schránky. Krátce se zobrazí potvrzení.
Kliknutím na Exportovat vše zkopírujete každou barvu jako formátovaný seznam. Vložte do souboru CSS proměnných, designového nástroje nebo dokumentace.
Přejděte na různé stránky stejného webu a extrahujte palety pro ověření konzistence barev napříč stránkou.
Nainstalujte si DevSuite Pro zdarma a odemkněte 39+ vývojářských nástrojů pro svůj prohlížeč.
