Obsah:

Použití barevných schémat

Nejen při návrhu webových stránek, ale čehokoli, kde se používají barvy (počítačové aplikace, návrh interiéru atd.), potřebujeme najít vhodné barevné schéma - tedy sadu barev, které mají produkovat 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 zdlouhavá a úmorná práce. Díky teorii barev je však možné si ji usnadnit - tento nástroj najde sadu barev, z níž je možné při návrhu vycházet, a usnadnit tak hledání optimální palety.

Tato aplikace generuje barevná schémata několika typů. Každé vychází z jedné základní barvy, k níž doplní několik dalších barev, které 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. Tato aplikace pracuje primárně s barevným kruhem a tedy s barvami definovanými pomocí něj - 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 teplé (purpurová až žlutá) a studené (žlutozelená až fialová) barvy.

Kliknutím na barevný kroužek barevného kruhu můžeme 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-360° na níž je malý ukazatel na úhlu odpovídajícímu odstínu použité 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.: Tato aplikace nepoužívá standardní HSV nebo HSB model (podobné hodnoty HSV/HSB třeba z Photoshopu 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ří odstíny v s menším jasem oproti základním barvám RGB modelu. RGB spektrum navíc 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 použitím 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ích barevných schémat:

Monochromatické

Barevné schéma vychází z jediného odstínu a používá jen variací vzniklých změnou sytosti a jasu, doplněné o černou a bílou. Výsledek, na něž 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 již těžší vytvořit nějaká zvýraznění či podtržení barevného tónu.

Program vytváří jen několik monochromatických variant každé barvy, není jistě 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 přesně 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í, a 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í shodně po obou stranách od jejího doplňku. Na rozdíl od "ostrého" kontrastu je tato varianta často pro oko 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-30°. Vyšší hodnoty již nejsou příliš vhodné, výjimkou je posun o 60°, který 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"

Toto schéma je tvořeno dvojicí barev a jejich doplňky. Vychází z tzv. tetrády - tedy čtveřice barev rozmístěných rovnoměrně na čtvrtinách kruhu (po 90°). 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í, toto schéma je ale i tak vždy dost "nervní" a "akčnější" než schémata ostatní. Při práci s ním je třeba dát si hlavně pozor na vazby jedné barvy s protějškem barvy sousední - v případě tetrády (odstup 90°) jsou pak citlivý přístup a dobré oko potřebné bez diskusí.

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í barev zbývajících.

V doplňkovém vstupním poli můžete zvolit odstup sousedních barev - ideální bývají hodnoty 15-30°. Můžete zde 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 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 z pravidel zde uvedených. 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řebujeme, vyberme jen několik variant základní barvy, pro doplnění případně jednu či dvě varianty jedné z kontrastních barev. Druhým možným použitím 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). To, aby spolu dobře ladily, vám snad pomůže zajistit tato pomůcka.

Licence

Tento produkt je šířen pod licencí BY-NC-SA. Licence pro komerční užití neposkytuji.


Výpočet barevných schémat
Copyright (c) 2002 pixy