Převeď hodnoty CMYK na HEX kód
Zadej čtyři podíly tiskových barev a HEX kód se objeví už během psaní: cmyk(76%, 47%, 0%, 4%) je #3B82F5. Pole přijímá čísla se znakem procenta i bez něj, s desetinnou čárkou a s písmeny C, M, Y, K, takže hodnoty vložíš přímo z manuálu značky nebo ze specifikace tiskárny.
Jak převést CMYK na HEX?
Nejdřív ze čtyř tiskových barev spočítej tři kanály světla a pak každý kanál zapiš dvěma šestnáctkovými znaky. Procenta dosazuješ do vzorce jako zlomky, takže 76% je 0,76.
Vzorec: R = 255 × (1 − C) × (1 − K). Zelený kanál spočítáš stejně z purpurové a modrý ze žluté.
Pro cmyk(76%, 47%, 0%, 4%) vychází červený kanál 255 × 0,24 × 0,96, tedy 59, zelený 130 a modrý 245. Teď každé číslo vyděl šestnácti: 59 je 3 × 16 a zbytek 11, a jedenáctce odpovídá písmeno B, takže červený kanál se zapíše jako 3B. Stejně tak ze 130 je 82 a z 245 je F5. Výsledek je #3B82F5.
Převodník CMYK na RGB se zastaví v půli cesty, u tří čísel. Kód z obrazovky převedeš na tiskové barvy převodníkem HEX na CMYK.
Co říkají čtyři čísla CMYK a šest znaků HEX?
Čtyři čísla CMYK jsou recept pro tiskový stroj: jakou část papíru pokrýt azurovou, purpurovou, žlutou a černou[1]. Proto je najdeš ve specifikacích tiskáren a v manuálech značky, protože popisují tiskovou barvu, a ne to, co ukazuje monitor.
Šest znaků HEX jsou tři čísla od 0 do 255 zapsaná v šestnáctkové soustavě, po dvou znacích pro červené, zelené a modré světlo[2]. Tento kód vkládáš do CSS, do šablony webu, do Canvy nebo do Figmy.
Výsledek má vždy šest znaků, protože tisková barva nemá průhlednost a do sedmého a osmého znaku není co zapsat. Kód píšeme velkými písmeny, prohlížeč ale přečte #3b82f5 stejně[2].
Pokud máš barvu v jiném zápisu, třeba v OKLCH, Lab nebo jako kód z Androidu, převodník barev ji ukáže najednou ve všech zápisech.
Jaký HEX kód mají rastry čtyř tiskových barev?
| Hodnoty CMYK | Tisková barva | HEX kód |
|---|---|---|
| 100%, 0%, 0%, 0% | Azurová 100% | #00FFFF |
| 50%, 0%, 0%, 0% | Azurová 50% | #80FFFF |
| 20%, 0%, 0%, 0% | Azurová 20% | #CCFFFF |
| 0%, 100%, 0%, 0% | Purpurová 100% | #FF00FF |
| 0%, 50%, 0%, 0% | Purpurová 50% | #FF80FF |
| 0%, 20%, 0%, 0% | Purpurová 20% | #FFCCFF |
| 0%, 0%, 100%, 0% | Žlutá 100% | #FFFF00 |
| 0%, 0%, 50%, 0% | Žlutá 50% | #FFFF80 |
| 0%, 0%, 20%, 0% | Žlutá 20% | #FFFFCC |
| 0%, 0%, 0%, 100% | Černá 100% | #000000 |
| 0%, 0%, 0%, 50% | Černá 50% | #808080 |
| 0%, 0%, 0%, 20% | Černá 20% | #CCCCCC |
| 0%, 0%, 0%, 10% | Černá 10% | #E6E6E6 |
Manuál značky uvádí jiný HEX kód než převodník. Který použít?
Použij ten z manuálu. Vzorec počítá s dokonalými barvami na dokonale bílém papíře, takže výsledek vyjde světlejší a sytější než skutečný tisk. Kód z manuálu bývá mnohem blíž tomu, co je vidět na papíře.
Dobře to ukazuje manuál jednotného vizuálního stylu Ministerstva průmyslu a obchodu, jehož barvy vycházejí z národních barev. Pro tmavě modrou uvádí 100% azurové, 67% purpurové a 23% černé spolu s kódem 004B8D[3]. Vzorec z těchto barev udělá #0041C4, výrazně jasnější modrou. S tiskovým profilem PSO Coated v3, který jsme použili přes knihovnu Little CMS[4] a soubor od European Color Initiative[5], vyjde #004486, skoro kód z manuálu.
Když manuál uvádí jen CMYK, převodník ti dá pracovní kód. Porovnej ho s vytištěným letákem nebo vizitkou a barvu ve Figmě nebo v CSS ztmav, pokud na obrazovce svítí víc než na papíře.
Barvy Ministerstva průmyslu a obchodu: vzorec, tiskový profil a manuál
| CMYK v manuálu | HEX podle vzorce | HEX s PSO Coated v3 | HTML v manuálu |
|---|---|---|---|
| 100%, 67%, 0%, 23% | #0041C4 | #004486 | #004B8D |
| 85%, 24%, 0%, 0% | #26C2FF | #008FCF | #0096D6 |
| 0%, 100%, 99%, 4% | #F50002 | #DF000E | #E31B23 |
| 0%, 100%, 96%, 28% | #B80007 | #B40309 | #B5121B |
Vrátí se hodnoty CMYK po převodu na HEX a zpět?
| CMYK na začátku | HEX kód | CMYK po návratu |
|---|---|---|
| 100%, 80%, 0%, 0% | #0033FF | 100%, 80%, 0%, 0% |
| 76%, 47%, 0%, 4% | #3B82F5 | 76%, 47%, 0%, 4% |
| 0%, 12%, 100%, 5% | #F2D500 | 0%, 12%, 100%, 5% |
| 20%, 30%, 40%, 0% | #CCB399 | 0%, 12%, 25%, 20% |
| 40%, 30%, 20%, 10% | #8AA1B8 | 25%, 13%, 0%, 28% |
| 60%, 40%, 40%, 100% | #000000 | 0%, 0%, 0%, 100% |
| 100%, 100%, 100%, 100% | #000000 | 0%, 0%, 0%, 100% |
#000000 a z tohoto kódu se vrátí už jen samotná černá. Do tiskového souboru proto zadej hodnoty CMYK z manuálu nebo ze specifikace tiskárny, a ne výsledek cesty tam a zpět přes HEX.Jaké zápisy CMYK tento převodník přijme?
| Co zadáš | Co převodník ukáže | Jak to čteme |
|---|---|---|
| 76, 47, 0, 4 | #3B82F5 | Čtyři čísla čteme jako procenta v pořadí azurová, purpurová, žlutá a černá. |
| 76 47 0 4 | #3B82F5 | Stačí mezery, čárky mezi čísly nejsou potřeba. |
| 76 %, 47 %, 0 %, 4 % | #3B82F5 | Mezera před znakem procenta, jak se v češtině píše, převodu nevadí. |
| cmyk(76%, 47%, 0%, 4%) | #3B82F5 | Zápis se závorkami, stejný jako výsledek převodníku HEX na CMYK, přijmeme i s názvem. |
| C 76 M 47 Y 0 K 4 | #3B82F5 | Písmena kanálů, kterými manuály značky označují barvy, vynecháme a vezmeme čísla. |
| 76,5 47 0 4 | #3A82F5 | Čárku mezi dvěma číslicemi čteme jako desetinnou, jinak by vyšlo pět čísel místo čtyř. |
| 0,76 0,47 0 0,04 | #3B82F5 | Zlomky od 0 do 1, které vracejí některé programy a knihovny, převedeme na procenta. |
| device-cmyk(76% 47% 0% 4%) | #3B82F5 | Přijmeme i zápis ze specifikace CSS Color Module Level 5. |
| 150, 0, 0, 0 | #00FFFF | Hodnotu nad 100 omezíme na 100 a zápornou na nulu, protože barva nepokryje víc než celou plochu. |
device-cmyk() definuje CSS Color Module Level 5[6].Převést jiné jednotky na HEX
Převést CMYK na jiné jednotky
Zdroje
- CMYK — Wikipedie
- CSS Color Module Level 4: The RGB Hexadecimal Notations — W3C (anglická verze)
- Manuál jednotného vizuálního stylu — Ministerstvo průmyslu a obchodu
- Little CMS — Marti Maria (anglická verze)
- Downloads: ICC profiles from ECI — European Color Initiative (anglická verze)
- CSS Color Module Level 5: Specifying Uncalibrated CMYK Colors — W3C (anglická verze)
- Color Bridge Guide Coated — Pantone (anglická verze)
Všechny hodnoty v tabulkách jsme spočítali z definic jednotek a před zveřejněním ověřili výpočtem. Historické údaje a názvy místních jednotek vycházejí ze zdrojů uvedených výše.
Poslední revize obsahu: · napsal a zkontroloval tým Arteon
Časté dotazy k převodu CMYK na HEX
Můžu zadat číslo barvy Pantone?
Ne. Pole čeká čtyři čísla CMYK, kdežto číslo Pantone označuje předem namíchanou tiskovou barvu. Hodnoty CMYK a HTML pro barvy Pantone uvádí vzorník Pantone Color Bridge[7] a jeho hodnoty CMYK tu převedeš na HEX kód.
Co se stane, když zadám jen tři čísla?
Pole výsledku zůstane prázdné a pod ním se objeví upozornění, že zápis nejde přečíst jako barvu CMYK, s příkladem čtyř čísel. Stejně to dopadne s pěti čísly, protože převodník nehádá, které je navíc.
Hodí se HEX kód z tohoto převodníku do CSS?
Ano. Výsledek má tvar #RRGGBB, který přijme každý prohlížeč[2]. Tlačítko Kopírovat výsledek zkopíruje kód i s mřížkou.
Pomoz nám vylepšit naše nástroje
Máš nápad na novou funkci, vidíš chybu nebo chceš navrhnout jiný nástroj? Napiš nám.