Potřebujete barvu pro návrh, graf nebo prázdné plátno a nechcete ji vybírat ze zvyku? Tento bezplatný generátor náhodných barev čerpá barvy z celého 24bitového rozsahu, který dokáže zobrazit obrazovka, a každou z nich zobrazí na barevné ukázce vedle jejího kódu. V poli „Počet“ vyberte, kolik barev chcete — libovolné číslo od 1 do 50 — zaškrtněte potřebné formáty a stiskněte tlačítko „Generovat“. Stránka se otevře s jednou barvou ve formátu HEX, takže první výsledek je vzdálen jediné kliknutí. Zaškrtávací pole „HEX kód“ je zaškrtnuté od začátku, vedle něj jsou pole „RGB kód“ a „HSL kód“, a libovolnou kombinaci těchto tří lze zapnout současně. Tlačítko s ozubeným kolečkem vedle tlačítka „Generovat“ otevře sekci „Pokročilé možnosti“, kde můžete barvy omezit na jeden druh nebo rozsah, vyloučit opakování a změnit způsob zápisu HEX.
Každá barva vzniká ve vašem prohlížeči prostřednictvím rozhraní Web Crypto API (crypto.getRandomValues), které poskytuje kryptograficky silné náhodné bajty z vlastního zdroje náhodnosti vašeho systému, místo pseudonáhodné funkce, jako je Math.random(). Barva na obrazovce se skládá ze tří kanálů — červeného, zeleného a modrého — z nichž každý je celé číslo od 0 do 255, a jeden náhodný bajt může nabýt přesně 256 hodnot. Každý kanál je tedy prostě jeden bajt, bez jakéhokoli mezikroku: nebere se žádný zbytek a žádný krok převodu neupřednostňuje žádný odstín. Díky tomu je všech 16 777 216 barev, které stránka dokáže vytvořit, při každém stisknutí tlačítka „Generovat“ naprosto stejně pravděpodobných. Užší rozsah v sekci „Pokročilé možnosti“ zachovává tuto záruku v mezích rozsahu: barvy se stále čerpají z celého prostoru a ty, které padnou mimo něj, se vyřadí, takže každá barva, kterou rozsah povoluje, má stejnou šanci. Nic se neodesílá na server, nic se nezaznamenává, a jakmile se stránka načte, funguje dál i bez připojení k internetu.
Tři formáty popisují stejnou barvu třemi způsoby. Formát „HEX kód“ je šestimístný tvar používaný v CSS a ve většině návrhářských nástrojů, například #0778ff; zapisuje se malými písmeny s počátečním #, a volby „Velká písmena“ a „Bez #“ v sekci „Pokročilé možnosti“ to mění pro nástroje, které očekávají jiný zápis. Formát „RGB kód“ vypisuje všechny tři kanály zvlášť, jako v rgb(7, 120, 255), což se hodí pro kód, který pracuje s každým kanálem samostatně. Formát „HSL kód“ popisuje barvu pomocí odstínu, sytosti a světlosti, jako v hsl(213, 100%, 51%) — nejsnazší tvar pro pozdější ruční úpravu. Všechny tři formáty se dají vložit přímo do stylopisu. Nejsou ale stejně přesné. HEX a RGB jsou přesné; HSL je zaokrouhlený. Stránka zapisuje odstín, sytost a světlost jako celá čísla, a přibližně u 89 % barev se tato zaokrouhlená hodnota nepřevede zpět na přesně stejnou barvu: #646503 se zobrazí jako hsl(61, 94%, 20%), což se zpět převede na #616303. Rozdíl v jednom kanálu nikdy nepřesáhne 5 kroků a obvykle je 1 nebo 2 — na obrazovce neviditelný, ale reálný, pokud uložíte hodnotu HSL a očekáváte zpět původní HEX. Pro ukládání proto používejte HEX nebo RGB.
Jedna barva se zobrazí jako jediný čip uprostřed výsledku; více barev se zobrazí jako číslovaný seznam, jedna barva na řádek, s vybranými formáty vedle sebe a malým odznakem kontrastu na konci. Seznam s více než třemi barvami se uvnitř rámečku posouvá a šipka v jeho rohu jej rozbalí do plné výšky; stránka si pamatuje, v jakém stavu jste jej nechali. Kliknutím na libovolný kód zkopírujete jen tento kód. Tlačítko kopírování na konci řádku zkopíruje všechny kódy dané barvy na jeden řádek oddělené mezerami. Klikněte na samotnou ukázku a otevře se výběr barvy vestavěný v prohlížeči: vyberte tam jinou barvu a všechny kódy v daném řádku se přepíší tak, aby jí odpovídaly, v každém zapnutém formátu, včetně jejího odznaku. Tlačítko „Kopírovat vše“ zkopíruje celou dávku, jednu barvu na řádek, a tlačítko „Uložit do souboru“ zapíše stejný text do prostého souboru .txt; obě volby respektují jakoukoli barvu, kterou jste změnili ve výběru barvy. Sekce „Historie“ uchovává vašich posledních 10 dávek v tomto prohlížeči přesně tak, jak byly vygenerovány, a tlačítko „Vymazat“ vyprázdní výsledek. Vaše nastavení, včetně nastavení v sekci „Pokročilé možnosti“, se pamatují pro příští návštěvu.
Stejně pravděpodobné barvy nevypadají rovnoměrně rozložené, a vědět, co čekat, vám ušetří stisknutí tlačítka „Generovat“ ze špatného důvodu. Při měření napříč celým rozsahem je přibližně 35 % barev jasných a sytých, se sytostí HSL alespoň 70 % a světlostí mezi 35 % a 65 %. Barvy blízké šedé, se sytostí pod 20 %, tvoří jen přibližně 4 %, a velmi tmavé (světlost pod 20 %) a velmi světlé (nad 80 %) tvoří přibližně 3 % každá. Dávka deseti barev z volby „Všechny barvy“ proto obvykle obsahuje několik výrazných barev a jen zřídka pastelovou nebo tmavě šedou barvu. Když potřebujete konkrétní druh, vyberte jej v poli „Typ barvy“: volba „Živá“ zachová právě tuto jasnou skupinu a volby „Pastelová“, „Tmavá“, „Tlumená“ a „Stupně šedi“ dělají totéž pro své skupiny. Volba „Vlastní“ vám umožní nastavit si vlastní rozsahy „Odstín“, „Sytost“ a „Světlost“, přičemž rozsah odstínu může přejít přes 0, takže rozsah od 330 do 30 dává červené barvy. Rozsah se kontroluje podle kódu HSL, který stránka zobrazuje, takže žádný kód nespadá mimo něj, a pokud obsahuje příliš málo barev pro hodnotu v poli „Počet“, stránka vás požádá, abyste rozsah rozšířili, místo aby opakovala barvy. Opakování je jinak možné, ale vzácné: zaškrtněte „Bez opakování“, abyste je vyloučili, a bez toho je pravděpodobnost, že dvě z 50 barev z celého rozsahu vyjdou stejné, přibližně 1 z 13 700.
Náhodná barva bývá často požadována jako pozadí, což vyvolává jedinou otázku, na kterou ukázka nedokáže odpovědět pouhým okem: bude na ní text čitelný? Pokyny pro přístupnost webu, WCAG, vyžadují poměr kontrastu alespoň 4,5:1 pro běžný text. Při měření napříč všemi barvami, které tato stránka dokáže vytvořit, toho černý text dosahuje u přibližně 65 % z nich a bílý text u přibližně 36 %, a neexistuje barva, u níž selžou oba: lepší z obou vždy dosáhne alespoň 4,58:1. Proto u jakéhokoli náhodného pozadí bude černý nebo bílý text čitelný a stránka vám ukáže který. Vedle každé barvy se zobrazuje malý odznak, který zobrazuje Aa v lepší ze dvou barev, následovaný jejím poměrem kontrastu. Poměr se zaokrouhluje dolů, takže nikdy neukazuje lepší kontrast, než jaký doopravdy je, a aktualizuje se, když barvu změníte ve výběru barvy. Odznak porovnává pouze černý a bílý text; u firemní barvy nebo jakékoli jiné barvy textu ověřte dvojici v nástroji na kontrolu kontrastu.
Náhodnost není totéž co harmonie. Každá barva v dávce se čerpá samostatně, bez znalosti ostatních, takže generátor nikdy nevytváří paletu ve smyslu, který má na mysli návrhář — žádné doplňkové dvojice, žádné analogické řady, žádnou sdílenou světlost. Užší rozsah mění charakter dávky, ne toto pravidlo: pastelové barvy nebo řada modrých přesto přicházejí jedna po druhé, aniž by je cokoli spojovalo. V tom je smysl: dává vám barvu, kterou byste si sami nevybrali, a právě to prolomí zvyk nebo tvůrčí zablokování. Chcete-li proměnit náhodný nález v něco použitelného, ponechte si barvu, která se vám líbí, a ostatní od ní odvoďte, místo abyste mačkali tlačítko „Generovat“, dokud se náhodou neshodne celá dávka. Zachovejte její odstín a postupně měňte světlost pro světlejší a tmavší varianty, nebo otočte odstín o 180 stupňů, abyste získali opačnou barvu. Formát „HSL kód“ mění tyto kroky v počítání, ne v hádání.
Proč si vybrat tento generátor náhodných barev?
- Každá barva vzniká ve vašem prohlížeči pomocí Web Crypto API, nic se nenahrává
- Všech 16 777 216 barev je naprosto stejně pravděpodobných, jeden náhodný bajt na kanál
- Kódy HEX, RGB a HSL pro stejnou barvu, v libovolné kombinaci
- Až 50 barev najednou, každá na barevné ukázce s odznakem kontrastu textu
- Živá, Pastelová, Tmavá, Tlumená a Stupně šedi, nebo váš vlastní rozsah odstínu, sytosti a světlosti
- Bez opakování, když je potřebujete, a HEX velkými písmeny nebo bez #
- Kliknutím na kód jej zkopírujete, nebo změníte libovolnou barvu ve výběru barev vašeho prohlížeče
- Kopírovat vše, Uložit do souboru a Historie posledních 10 dávek uložená ve vašem prohlížeči
- Zdarma a bez omezení: žádná registrace, žádná kvóta, na našich serverech se nic neukládá
Náhodné barvy se hodí všude tam, kde je barva potřeba dřív, než se pro nějakou někdo rozhodne. Návrháři je používají k prolomení tvůrčího zablokování a k nalezení výchozího bodu, ke kterému by se jejich obvyklá paleta nikdy nedostala. Vývojáři jimi vyplňují návrhy, zástupné prvky a avatary, dávají každé řadě v grafu vlastní barvu, dokud ještě není určeno skutečné téma, a testují, jak si rozhraní poradí s pozadími, pro která nebylo navrženo — dávka 50 barev z volby „Všechny barvy“ téměř vždy obsahuje alespoň jednu velmi tmavou nebo velmi světlou barvu, a volby „Tmavá“ nebo „Pastelová“ zamíří test k jednomu z krajů. Umělci generativního umění a vývojáři herních prototypů zadávají hodnoty přímo do kódu, kde tvar RGB odpovídá většině grafických knihoven. Učitelé kladou tři formáty vedle sebe, aby ukázali, že jednu barvu lze zapsat jako kód, jako tři kanály nebo jako pozici na barevném kole, a proč je verze HSL zaokrouhlená. A každý, kdo v seznamu barvami popisuje, značí nebo třídí, získá odlišitelné barvy, aniž by se trápil tím, kterou vybrat.
Stojí za to znát pár poctivých omezení. Jde o generátor, ne o nástroj na palety: nevytváří barevné harmonie ani neudržuje jednu barvu pevnou, zatímco se ostatní mění, a užší rozsah dává barvy jednoho druhu, ne barvy vybrané tak, aby k sobě ladily. Odznak kontrastu porovnává pouze černý a bílý text. Stránka pracuje s barvami sRGB, které zobrazuje obrazovka — HEX, RGB a HSL — bez průhlednosti a bez CMYK, Pantone, OKLCH nebo pojmenovaných barev CSS; pro tisk barvu sladíte v tiskové přípravě, místo abyste se spoléhali na kód z obrazovky. Stejný kód může na různých displejích vypadat mírně odlišně, protože obrazovky nejsou kalibrovány stejně. Hodnoty HSL jsou zaokrouhlené, jak je popsáno výše, a pokud není zaškrtnuto „Bez opakování“, dávka se na opakování nekontroluje. To, co stránka skutečně zaručuje, je užší a přesné: každá z jejích 16 777 216 barev, nebo každá barva v mezích rozsahu, který jste nastavili, má při každém stisknutí stejnou šanci, čerpanou z kryptografického zdroje vašeho prohlížeče a nikdy nikam neodeslanou.