Generátory barev
Palety (nejen) pro webové designéry
Při návrhu webových stránek i čehokoli jiného, kde se používají barvy (jde například o počítačové aplikace či o návrh interiéru), potřebujeme najít vhodné barevné schéma - tedy sadu barev, které mají vytvářet co nejlepší celkový dojem. Ne všechny barvy však mohou koexistovat - některé kombinace působí nepříjemně či rušivě.

Zkušení designéři mají kombinace "v oku"
- mnozí lidé poznají, které barvy spolu ladí a které ne. Někdy je ale nalezení dobré kombinace zdlouhavou a úmornou prací. Díky teorii barev je však možné si ji usnadnit. V následujícím textu vás seznámíme s několika existujícími nástroji a celou problematiku blíže vysvětlíme na aplikaci Barevná schémata, kterou najdete na www.pixy.cz/apps/barvy a jejímž autorem je Petr Staníček.
Aplikace vyhledá sadu barev, z níž je možné při návrhu vycházet, a tak si usnadnit hledání optimální palety. Generuje barevná schémata několika typů. Každé vychází z jedné základní barvy, k níž doplní několik barev dalších, jež společně dosahují nejlepšího optického dojmu - vždy podle jednoho z ověřených algoritmů.

VÝBĚR ZÁKLADNÍ BARVY
Základní barvu, z níž barevné schéma vychází, můžeme definovat několika způsoby. Aplikace pracuje primárně s barevným kruhem, tedy s barvami definovanými jeho pomocí. Určíme odstín (úhel určující pozici barvy na kruhu), sytost (poměr mezi nejtmavší a nejsvětlejší složkou RGB - 100 % je nejsytější barva, 0 je odstín šedé) a jas (hodnota nejvýraznější složky RGB - 100 % je nejsvětlejší odstín, 0 je černá). Jsou zde také vyznačeny barvy teplé (purpurová až žlutá) a studené (žlutozelená až fialová). Kliknutím na kroužek barevného kruhu můžete vybrat přímo jednu ze základních barev. Primární barvy (červená, žlutá, modrá) odpovídají úhlům 0°, 120°, resp. 240°, sekundární (oranžová, zelená, fialová) pak úhlům 60°, 180° a 300°, terciární barvy jsou mezi nimi. Kruh také obsahuje (menší kroužky) i přechodové barvy - ty odpovídají násobkům 15°. Kliknutím na jednu z těchto barev ji nastavíte jako základní.
Ve vstupních polích můžete změnit parametry základní barvy - změnit její odstín, sytost i jas. Uvnitř barevného kruhu je stupnice 0 až 360°, na níž je malý ukazatel úhlu odpovídajícího odstínu zvolené barvy. Kliknutím na tuto stupnici můžete také změnit odstín, aniž byste změnili nastavenou sytost či jas (na stupnici je nutno kliknout, tažení ukazatele nefunguje). Aktuální úhel se zobrazuje ve stavovém řádku prohlížeče. Obdobně lze nastavit jas a sytost kliknutím na stupnice vedle barevného kruhu.
Poznámka: Aplikace nepoužívá standardní model HSV nebo HSB (podobné hodnoty HSV/HSB třeba z programu Photoshop vyjadřují jiné barvy!). Zde použitý barevný kruh se liší od spektra RGB používaného na obrazovkách, odpovídá více klasické teorii. Proto také některé základní barvy (především odstíny modré) tvoří ve srovnání se základními barvami modelu RGB odstíny s menším jasem. RGB spektrum tvoří kruh s primárními barvami červená - zelená - modrá, zde je to červená - žlutá - modrá. Tato deformace byla také příčinou některých problémů při převodu barev zadaných pomocí RGB hodnot - zadávání barev pomocí RGB proto není možné.

POUŽITÁ SCHÉMATA
Výsledná sada barev vznikne aplikací vybrané základní barvy do jednoho z barevných schémat. Schéma vybíráte z horního menu v pravé části stránky. Některá schémata umožňují další nastavení, která se zobrazí pod tímto menu. Popis jejich nastavení naleznete níže v popisu jednotlivých schémat. Můžete si vybrat jedno z následujících barevných schémat:
Monochromatické - barevné schéma vychází z jediného odstínu a používá jen variace vzniklé změnou sytosti a jasu, doplněné o černou a bílou. Výsledek, na nějž je aplikováno toto schéma, je celkem příjemný pro oči, a to i v jinak poměrně agresivních odstínech. Je však obtížnější vytvořit nějaká zvýraznění či podtržení barevného tónu.
Aplikace vytváří jen několik monochromatických variant každé barvy, ale není problém vytvořit další - sytější, světlejší či tmavší. Monochromatické variace jsou vytvořeny také pro všechny barvy v ostatních schématech, zobrazeny jsou v barevné paletě pod ukázkou použitých barev.
Kontrast - základní barva je doplněna o svůj doplněk (barvu na opačné straně barevného kola). Vznikne tak vždy jedna teplá a jedna studená barva - je potom na zvážení, která z nich bude dominantní; celek podle toho bude působit teplejším či chladnějším dojmem. Schéma lze pak doplnit o vhodné monochromatické variace těchto dvou barev.
"Měkký" kontrast - k základní barvě jsou doplněny dvě barvy, nacházející se shodně po obou stranách od jejího doplňku. Na rozdíl od "ostrého" kontrastu je tato varianta pro oko obvykle příjemnější, měkčí, navíc poskytuje větší prostor pro vyvážení teplých a studených barev.
V doplňujícím vstupním poli (zobrazí se pod volbou schématu) lze určit odstup těchto barev od doplňku základní barvy - čím menší hodnota, tím jsou barvy podobnější a blíže k barvě kontrastní. Ideální hodnotou bývá posun 15 až 30°. Vyšší hodnoty již nejsou příliš vhodné, výjimkou je posun o 60°, který už ale tvoří jiné barevné schéma, tzv. triádu.
Triáda - triáda je tvořena třemi barvami rovnoměrně rozloženými na třetinách barevného kruhu (po 120 stupních). Tato schémata jsou "vibrující" - plná energie - a poskytují velký prostor pro vytváření kontrastů, zvýraznění a vyvážení teplých a studených barev. Triádu vytvoříte pomocí schématu "měkký kontrast" s odstupem nastaveným na 60°.
"Dvojkontrast" - dvojkontrast je tvořen dvojicí barev a jejich doplňky. Při rovnoměrném rozmístění (po 90°) hovoříme o tzv. tetrádě. Tetráda je již velmi agresivní barevné schéma, vyžadující velmi dobré naplánování a citlivý přístup k vzájemným vazbám jednotlivých barev.
Menší rozestup mezi dvěma základními barvami dá celku menší napětí, i tak je však toto schéma vždy více "nervní" a "akčnější" než schémata ostatní. Při práci s ním je třeba si dát pozor hlavně na vazby jedné barvy s protějškem barvy sousední.
Analogické barvy - toto schéma tvoří základní barva a její barvy sousední, tedy barvy shodně po obou stranách. Vypadá většinou velmi elegantně a čistě, ve výsledku je menší napětí a působí jednotně teple či studeně. Pokud zvolíte barvu na hranici teplých a studených odstínů, lze tu sousední barvu, která má opačnou "teplotu", použít pro zvýraznění a podtržení zbývajících barev.
V doplňkovém vstupním poli můžete zvolit odstup sousedních barev - ideální bývají hodnoty 15 až 30°. Můžete také přidat kontrastní barvu, do schématu tak přibude barva doplňková k barvě základní. Považujte ji však jen za doplňující - přidává paletě napětí a v přehnané míře působí příliš agresivně; použitá v detailech a pro podtržení hlavních barev však může být velmi účinná a elegantní.
Rozporné barvy - žádné takové barevné schéma zde nenajdete, je to naopak schéma, které nedokážete "vecpat" do žádného ze zde uvedených pravidel. Takové schéma nemusí být úplně zbytečné - mohou nastat situace, kdy je třeba připravit dílo šokující, opravdu křiklavé. I v tomto případě může být tato stránka užitečná - pokud se vaše schéma diametrálně liší od všech uvedených modelů, máte patrně to pravé: nervní, řvavou, agresivní sadu barev. Je však pochopitelné, že taková sada není vhodná tam, kde hlavním záměrem výsledku nejsou pouze takovéto vypjaté emoce.

BAREVNÁ PALETA
Pod ukázkou barevného schématu se zobrazuje barevná paleta. V prvním sloupci jsou hlavní barvy - tak, jak jsou použity ve zvoleném schématu. V dalších sloupcích jsou jejich monochromatické varianty (v jednom sloupci vždy shodné). Kódy všech barev v tabulce jsou zároveň odkazy - kliknutím na libovolnou z barev ji nastavíte jako barvu základní.
Přepínačem pod tabulkou barev je možné paletu zredukovat na tzv. WebColors (216 "bezpečných" barev pro web). Tento převod však mění odstíny barev a odladěné barevné schéma může zdeformovat. Použijte proto raději jen takové barvy, které se po převodu na WebColors od původních příliš neliší.
Pro zachování záměru barevného schématu by monochromatické varianty neměly být nadužívány, většinou se doporučuje použít jen černou a bílou. Pokud další varianty opravdu potřebujete, vyberte jen několik variant základní barvy, pro doplnění případně jednu či dvě varianty jedné z kontrastních barev. Druhou možností je také stejná varianta všech hlavních barev (např. stejný motiv ve světlejších, bledších či tmavších odstínech). Obecně platí, že jedna aplikace (např. jedna WWW stránka či celý web) by měla kromě černé a bílé používat nejvýše šest barev (včetně všech variant). Aby spolu dobře ladily, vám snad pomůže zajistit popsaná pomůcka.

EASY RGB
Easy RGB je další nástroj, který můžete použít při hledání vhodného barevného schématu. Na rozdíl od předcházejícího vám poskytne několik různých metod, například Color Harmonies, Color Matching, Search a Tint, Color Calculator, Monitor Calibration Wizard, a dokonce EasyRGB-PC Software. Color Harmonies vám pomůže najít k zadaným RGB hodnotám příslušné doplňkové barvy - to je Color Matching, párovaní barev. Pomocí Search a Tint, hledání barev a odstínů, lze vytvořit specifickou kolekci barevných kódů a názvů. Color Calculator umožní konvertovat barevná data do odlišného prostoru barev, například RGB na CIEL*ab, CMY na XYZ a jiné. Monitor Calibration Wizard vás provede čtyřmi jednoduchými kroky, které jsou potřebné k barevné kalibraci vašeho systému. Po kliknutí na tlačítko Start se aktivuje kalibrační cyklus. EasyRGB-PC Software je aplikace Windows, která obsahuje všechny popisované funkce bez nutnosti připojit se k internetu. Bohužel tento program je nutné zakoupit a cena není nijak příznivá, protože za jednu licenci zaplatíte až 178 USD. Pokud však podnikáte v oblasti tvorby webových stránek, může se vám takový program docela hodit. Pro vyzkoušení zamiřte na stránku www.easyrgb.com/harmonies.php.

COLORMATCH REMIX
ColorMatch Remix je snadno ovladatelný colorpicker (generátor barev). Autor tohoto zajímavého projektu se inspiroval kódem ze stránky http://colormatch.dk - proti řešení z této stránky autor přidal několik nových funkcí. Aplikace chodí bezchybně ve všech známých prohlížečích (Internet Explorer, Mozilla a Opera). ColorPicker najdete na stránce http://color.twysted.net. Vstupními hodnotami jsou tři kódy RGB, k nimž pak můžete vygenerovat až devět barev. Takto vygenerované barvy můžete uložit pod názvem přímo na dané stránce, nebo můžete barvy exportovat do aplikace Adobe Photoshop (soubor *.ACT), resp. do aplikace Adobe Ilustrator (soubor *.AI).

COLOR BLENDER
Dalším programem, který má něco společného s hledáním barev, je program Color Blender. Najdete ho na stránce www.meyerweb.com/eric/tools/color-blend. Vstupními hodnotami jsou dvě barvy, které je třeba zvolit z panelu barev zobrazeného na stránce. Kromě toho musíte zadat počet středních bodů, které byste rádi viděli. Nevýhodou této aplikace je to, že je funkční pouze v Internet Exploreru.

ZÁVĚR
Rozhodně doporučuji popisované generátory barev vyzkoušet. Možná se vám jejich pomocí podaří vytvořit stránku, která bude perfektně barevně sladěna. Závěrem bych rád poděkoval Petru Staníčkovi za možnost recenzovat jeho zajímavý produkt Barevná schémata.

Peter Gašparovič