Při práci se šablonami se často můžeme setkat s možností nastavení barev. Nejčastěji se požívájí dva druhy kódů barev: hexadecimální a RGB kód barvy.
Hexadeciální
Požívají se ve formátu #RRGGBB. První dvě číslice znamenají hodnotu červené barvy, třetí a čtvrtá hodnotu zelená a poslední dvě hodnotu modré barvy. Výsledné barvy vznikají mícháním těchto tří základních, přičemž nižší hodnoty jsou tmavší odstíny a vyšší naopak světlejší odstíny.
Každá z šesti pozic může nabývat hodnot 0 – F. Jedná se o šestnáctkový nebo-li hexadecimální zápis. Z toho důvodu hexadecimální kód barvy. V kódu se nerozlišují velká a malá pásmena.
Příklady:
#FF0000 – červená
#00FF000 – zelená
#0000FF – modrá
#FFFF00 – žlutá
#000000 – černá
Je možno použít i zkrácený zápis
#F00 – červená
#0F0 – zelená
#00F – modrá
#FF0 – žlutá
#000 – černá
RGB
Jedná se o stejný princip jako u hexadecimálního kódu. Zápis se liší se pouze v syntaxi – rgb(RRR,GGG,BBB) Barva může nabývat hodnot 0-255 popřípadě lze použít procenta.
Příklady
rgb(255,0,0) – červená
rgb(0,255,0) – zelená
rgb(0,0,255) – modrá
rgb(255,255,0) – žlutá
rgb(0,0,0) – černá
Je možno použít i procentuální zápis
rgb(100%,0%,0%) – červená
rgb(0%,100%,0%) – zelená
rgb(0%,0%,100%) – modrá
rgb(100%,100%,0%) – žlutá
rgb(0%,0%,0%) – černá
Průhlednost barvy
U RGB lze také nastavit průhlednost. Dělá se to přidáním čtvrté hodnoty a pozměněním syntaxe. Tato hodnota se udává v rozmezí 0-1, kdy 0 je úplná průhlednost a 1 je neprůhledná. Nutno použít desetinnou tečku.
rgba(0,0,0,0.3) – průhlednost 0.3
rgba(0,0,0,0.5) – průhlednost 0.5
rgba(0,0,0,0.7) – průhlednost 0.7