--- site_name: WPlama site_description: "Správa, opravy a vývoj WordPress webů a e-shopů" site_url: https://www.wplama.cz contact_email: info@wplama.cz title: "Seriál \"Začínáme s programováním\" - Úvod: Barvy" url: https://www.wplama.cz/serial-zaciname-s-programovanim-barvy/ date: 2014-06-02 modified: 2014-06-11 author: Zdeněk Vojáček type: post categories: [Snippety] tags: [Barvy, HTML, WordPress návody] --- Snippety # Seriál „Začínáme s programováním“ – Úvod: Barvy [ZV **Zdeněk Vojáček**](https://www.wplama.cz/author/wojda/) Publikováno 2. 6. 2014 Aktualizováno **11. 6. 2014** 2 min čtení Pozor: Článek je z roku 2014. Některé postupy se mohly změnit. ![HTML](https://www.wplama.cz/wp-content/uploads/2014/06/HTML.jpg "HTML") Obsah článku (3 kapitoly) 1. [Hexadeciální](https://www.wplama.cz/serial-zaciname-s-programovanim-barvy/#hexadecialni) 2. [RGB](https://www.wplama.cz/serial-zaciname-s-programovanim-barvy/#rgb) 3. [Průhlednost barvy](https://www.wplama.cz/serial-zaciname-s-programovanim-barvy/#pruhlednost-barvy) 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 - [#Barvy](https://www.wplama.cz/stitek/barvy/) - [#HTML](https://www.wplama.cz/stitek/html/) - [#WordPress návody](https://www.wplama.cz/stitek/navody/) Sdílet - - [](mailto:?subject=Seriál „Začínáme s programováním“ – Úvod: Barvy&body=Seriál „Začínáme s programováním“ – Úvod: Barvy https://www.wplama.cz/serial-zaciname-s-programovanim-barvy/) - [](https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fwww.wplama.cz%2Fserial-zaciname-s-programovanim-barvy%2F) - [](https://www.linkedin.com/sharing/share-offsite/?url=https%3A%2F%2Fwww.wplama.cz%2Fserial-zaciname-s-programovanim-barvy%2F) ZV Autor Zdeněk Vojáček Milovník žen, masa a PHP kódu 11 článků [Všechny články autora →](https://www.wplama.cz/author/wojda/) ## Komentáře Zatím tu nikdo nekomentoval. Napište první komentář. ### Přidat komentář [Zrušit odpověď](https://www.wplama.cz/serial-zaciname-s-programovanim-barvy/#respond) [← Předchozí článek Jak přidat na WP web barevný scrollbar (posuvník)](https://www.wplama.cz/jak-pridat-na-wp-web-barevny-scrollbar-posuvnik/) [Další článek → Surfař](https://www.wplama.cz/surfar/) Související ## Mohlo by vás zajímat [Všechny články z rubriky Snippety →](https://www.wplama.cz/wordpress/kodovani/) ![wordpress programovani](https://www.wplama.cz/wp-content/uploads/2025/10/wordpress-programovani.jpg "wordpress programovani") Snippety ### [Jak ve WordPressu (včetně Gutenberg) automaticky nahradit „a, i, k, o, s, u, v, z“ pevnou mezerou](https://www.wplama.cz/jak-ve-wordpressu-vcetne-gutenberg-automaticky-nahradit-a-i-k-o-s-u-v-z-pevnou-mezerou/) 8. 10. 2025 3 min čtení --- ![wordpress editor](https://www.wplama.cz/wp-content/uploads/2024/02/wordpress-editor.png "wordpress editor") Snippety ### [Editor souborů ve WordPress](https://www.wplama.cz/editor-souboru-ve-wordpress/) 25. 3. 2024 2 min čtení --- ![cookies](https://www.wplama.cz/wp-content/uploads/2023/06/cookies.jpg "cookies") WordPress návody ### [Jak u pluginu Complianz upravit lištu a zvýšit počet lidí, který s použitím cookies souhlasí](https://www.wplama.cz/jak-u-pluginu-complianz-upravit-listu-a-zvysit-pocet-lidi-ktery-s-pouzitim-cookies-souhlasi/) 3. 7. 2023 1 min čtení ---