. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Facebook
Alpy, informace, aktuality, fotografie, videa, doporučení, ceny, popisy cest, aktuální počasí, ubytování v horských chatách, zkušenosti, aktuální situace, dopravní info

11. března 2017

Barvy pro webové stránky (tabulky barev)


    Při návrhu webových stránek nebo při modifikaci různých šablon blogů se jistě mohou hodit užitečné tabulky a další nástroje pro výběr vhodných barev. Barvy jsou většinou to první, co vnímá návštěvník stránek a často si podle nich vytvoří svůj první dojem. Správnou volbu barev na webových stránkách rozhodně nepodceňujte. Barvy mají i velký vliv na použitelnost a ovladatelnost stránek. Může se proto hodit několik jednoduchých nástrojů a pomůcek pro výběr barev pro webové stránky.

Základem je tabulka barev

Tabulku barev v plné velikosti zobrazíte zde ...

Tabulka obsahuje základních 256 barev s jejich hexadecimálními kódy, které můžete přímo vložit do HTML kódu stránek, nejčastěji do souboru s popisem stylů (CSS soubor). Stačí jen přidat znak # před uvedený kód. Například takto 'color:#ff0000' pro červenou barvu.

Na internetu najdete je poměrně hodně různých i mnohem podrobnějších barevných tabulek například:

Můžete využít i interaktivní webové utility, které s výběrem a kódováním barev pomohou velmi názorně a komplexně. Já rád využívám například HTML Color Picker.


K volbě barvy se dá použít i anglická verze Googlu. Když dáte vyhledat například rgb to hex, zobrazí se mixér barev a výslednou barvu vám prezentuje v různých barevných modelech (RGB kód v šestnáctkové soustavě a hodnoty pro všechny tři kanály i hodnoty pro modely HSV, HSL a CMYK.
Protože to funguje jen v anglické verzi Googlu, musíte použít odkaz s parametrem &hl=en (https://www.google.cz/search?q=rgb+to+hex&hl=en).


Barevný gradient

Pravdu velmi užitečná je služba na stejném webu, která velice jednoduše umožňuje definovat postupné přechody mezi jednotlivými barvami (barevný gradient). Barevný gradient využijete například při tvorbě pozadí stránek nebo velni často při tvorbě tlačítek s moderním vzhledem. Bez užitečných pomůcek na internetu je nutné použít některý z grafických programů (Photoshop, Gimp). Tam je zpravidla nutné umět program dobře ovládat. Se službou Color Gradient zvládnete definovat přechod velmi snadno a intuitivně a navíc máte k dispozici i výsledný CSS kód.



Zjištění kódu neznámé barvy

Mnohdy je potřeba zjistit jaká je to vlastně barva, která je na webové stránce použita. Líbí se Vám jakákoli barva na webové stránce nebo fotce a chcete zjistit její kód? Pak je tu například rozšíření (doplněk) pro prohlížeč Google Chrome. Doplněk se jmenuje Eye Dropper a po jeho instalaci do Chromu můžete zjistit barvu čehokoli, co se dá zobrazit v okně prohlížeče. Po kliknutí na Pick color from web page ze začnou zobrazovat kódy barev, na které najedete myší. Funguje to ale jen v rámci okna Chromu. Tento režim se ukončí kliknutím. Zároveň si Eye Dropper tuto nakliknutou barvu zapamatuje a přidá ji k několika posledním, které si zapamatoval. Přímo z okna Eye Dropperu můžete zkopírovat kód barvy v některém ze základních formátů.



Přidejte svůj názor nebo typ na užitečný nástroj pro práci s barvami. K dispozici je Vám prostor pro  komentáře pod článkem.

Komentáře:

Příspěvek můžete komentovat zde ...