Przelicz wartości CMYK na kod HEX
Wpisz cztery udziały farb, a kod HEX pojawi się w trakcie pisania: cmyk(76%, 47%, 0%, 4%) to #3B82F5. Pole przyjmuje liczby ze znakiem procenta i bez niego, z przecinkiem dziesiętnym i z literami C, M, Y, K, więc wkleisz wartości prosto z księgi znaku albo ze specyfikacji drukarni.
Jak przeliczyć CMYK na HEX?
Najpierw policz z czterech farb trzy kanały światła, a potem zapisz każdy kanał dwoma znakami szesnastkowymi. Procenty wstawiasz do wzoru jako ułamki, więc 76% to 0,76.
Wzór: R = 255 × (1 − C) × (1 − K). Kanał zielony liczysz tak samo z magenty, a niebieski z żółtego.
Dla cmyk(76%, 47%, 0%, 4%) kanał czerwony wynosi 255 × 0,24 × 0,96, czyli 59, zielony 130, a niebieski 245. Teraz każdą liczbę dzielisz przez 16: 59 to 3 razy 16 i reszta 11, a reszcie 11 odpowiada litera B, więc kanał czerwony zapisuje się jako 3B. Tak samo 130 daje 82, a 245 daje F5. Wynik to #3B82F5.
Drugą połowę tej drogi pokazuje osobno konwerter CMYK na RGB, który zatrzymuje się na trzech liczbach. Kod z ekranu zamienisz na farby konwerterem HEX na CMYK.
Co mówią cztery liczby CMYK, a co sześć znaków HEX?
Cztery liczby CMYK to przepis dla drukarni: ile procent powierzchni papieru pokryć cyjanem, magentą, żółtym i czernią[1]. Dlatego znajdziesz je w specyfikacjach drukarni i w księgach znaku, bo opisują farbę, a nie wygląd na ekranie.
Sześć znaków HEX to trzy liczby od 0 do 255 zapisane szesnastkowo, po dwa znaki na światło czerwone, zielone i niebieskie[2]. Taki kod wpisujesz w arkusz stylów, w motyw strony, w Canvę i w Figmę.
Wynik ma zawsze sześć znaków, bo farba nie ma przezroczystości, a więc nie ma czego zapisać w siódmym i ósmym znaku. Kod zapisujemy wielkimi literami, choć przeglądarka czyta tak samo #3b82f5[2].
Jeśli kolor masz w innym zapisie, na przykład w OKLCH, Lab albo jako kod z Androida, konwerter kolorów pokaże go naraz we wszystkich zapisach.
Jaki kod HEX mają rastry czterech farb?
| Wartości CMYK | Farba | Kod HEX |
|---|---|---|
| 100%, 0%, 0%, 0% | Cyjan 100% | #00FFFF |
| 50%, 0%, 0%, 0% | Cyjan 50% | #80FFFF |
| 20%, 0%, 0%, 0% | Cyjan 20% | #CCFFFF |
| 0%, 100%, 0%, 0% | Magenta 100% | #FF00FF |
| 0%, 50%, 0%, 0% | Magenta 50% | #FF80FF |
| 0%, 20%, 0%, 0% | Magenta 20% | #FFCCFF |
| 0%, 0%, 100%, 0% | Żółty 100% | #FFFF00 |
| 0%, 0%, 50%, 0% | Żółty 50% | #FFFF80 |
| 0%, 0%, 20%, 0% | Żółty 20% | #FFFFCC |
| 0%, 0%, 0%, 100% | Czerń 100% | #000000 |
| 0%, 0%, 0%, 50% | Czerń 50% | #808080 |
| 0%, 0%, 0%, 20% | Czerń 20% | #CCCCCC |
| 0%, 0%, 0%, 10% | Czerń 10% | #E6E6E6 |
Księga znaku podaje inny kod HEX niż kalkulator. Który wybrać?
Wybierz kod z księgi. Wzór zakłada idealne farby na idealnie białym papierze, więc wynik wychodzi jaśniejszy i bardziej nasycony niż prawdziwy wydruk. Kod z księgi zwykle leży znacznie bliżej tego, co widać na papierze.
Dobrze widać to na znaku Funduszy Europejskich. Księga tożsamości wizualnej podaje dla niebieskiego 100% cyjanu i 80% magenty oraz kod #003399[3]. Wzór robi z tych farb #0033FF, czyli jasny, świecący błękit. Profil drukarni PSO Coated v3 opisuje ten sam druk jako #113F93, czyli kolor bliski kodowi z księgi. Profil przeliczyliśmy biblioteką Little CMS[4] na podstawie pliku pobranego ze strony European Color Initiative[5].
Gdy księga podaje tylko CMYK, konwerter da Ci kod roboczy. Porównaj go wtedy z wydrukowaną ulotką albo wizytówką i przyciemnij kolor w Figmie czy w arkuszu stylów, jeśli na ekranie świeci mocniej niż na papierze.
Kolory znaku Funduszy Europejskich: wzór, profil i księga
| CMYK w księdze | Kolor | HEX ze wzoru | HEX z profilem PSO Coated v3 | HEX w księdze |
|---|---|---|---|---|
| 100%, 80%, 0%, 0% | Niebieski | #0033FF | #113F93 | #003399 |
| 0%, 100%, 100%, 0% | Czerwony | #FF0000 | #E7000D | #E21D2C |
| 0%, 0%, 100%, 0% | Żółty | #FFFF00 | #FFED00 | #FFCC00 |
| 0%, 0%, 0%, 100% | Czarny | #000000 | #12120D | #000000 |
#12120D, bo jest jaśniejsza od czerni złożonej ze wszystkich farb, którą profil uznaje za najciemniejszy punkt druku. Księga podaje dla ekranu czyste #000000, więc przy czerni kod ze wzoru zgadza się z księgą.Czy wartości CMYK wrócą po przeliczeniu na HEX i z powrotem?
| CMYK na początku | Kod HEX | CMYK po powrocie |
|---|---|---|
| 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 niego wraca już tylko sama czarna farba. Jeśli plik trafi do druku, wpisz tam wartości CMYK z księgi albo ze specyfikacji drukarni, a nie wynik drogi przez kod HEX.Jakie zapisy CMYK przyjmuje ten konwerter?
| Co wpisujesz | Co pokaże konwerter | Jak to czytamy |
|---|---|---|
| 76, 47, 0, 4 | #3B82F5 | Cztery liczby czytamy jako procenty w kolejności: cyjan, magenta, żółty i czerń. |
| 76 47 0 4 | #3B82F5 | Spacje wystarczą, bo przecinki między liczbami nie są potrzebne. |
| cmyk(76%, 47%, 0%, 4%) | #3B82F5 | Zapis z nawiasem, taki jak w wyniku konwertera HEX na CMYK, przyjmujemy razem z nazwą. |
| C 76 M 47 Y 0 K 4 | #3B82F5 | Litery kanałów, którymi księgi znaku opisują farby, pomijamy i bierzemy same liczby. |
| 76,5 47 0 4 | #3A82F5 | Przecinek między cyframi czytamy jako dziesiętny, bo inaczej wyszłoby pięć liczb zamiast czterech. |
| 0,76 0,47 0 0,04 | #3B82F5 | Ułamki od 0 do 1, które zwracają niektóre programy i biblioteki, przeliczamy na procenty. |
| (76, 47, 0, 4) | #3B82F5 | Krotkę z Pythona czytamy razem z nawiasem. |
| device-cmyk(76% 47% 0% 4%) | #3B82F5 | Zapis ze specyfikacji CSS Color Module Level 5 też przyjmujemy. |
| 150, 0, 0, 0 | #00FFFF | Wartość powyżej 100 przycinamy do 100, a ujemną do zera, bo farba nie pokryje więcej niż całą powierzchnię. |
device-cmyk() opisuje specyfikacja CSS Color Module Level 5[6].Konwertuj inne jednostki na HEX
Konwertuj CMYK na inne jednostki
Źródła
- CMYK — Wikipedia
- CSS Color Module Level 4: The RGB Hexadecimal Notations — W3C (wersja angielska)
- Księga Tożsamości Wizualnej marki Fundusze Europejskie 2021-2027 — Portal Funduszy Europejskich
- Little CMS — Marti Maria (wersja angielska)
- Downloads: ICC profiles from ECI — European Color Initiative (wersja angielska)
- CSS Color Module Level 5: Specifying Uncalibrated CMYK Colors — W3C (wersja angielska)
- Color Bridge Guide Coated — Pantone (wersja angielska)
Wszystkie wartości w tabelach wyliczyliśmy z definicji jednostek i sprawdziliśmy rachunkowo przed publikacją. Dane historyczne i nazwy lokalnych jednostek opieramy na źródłach wymienionych wyżej.
Ostatnia aktualizacja treści: · przygotował i sprawdził zespół Arteon
Najczęstsze pytania o przeliczanie CMYK na HEX
Czy mogę wpisać numer koloru Pantone?
Nie. Pole przyjmuje cztery liczby CMYK, a numer Pantone oznacza gotową farbę mieszaną przed drukiem. Wartości CMYK i HTML dla barw Pantone podaje wzornik Pantone Color Bridge[7], a jego wartości CMYK przeliczysz tutaj na kod HEX.
Co pokaże pole, gdy wpiszę tylko trzy liczby?
Pole wyniku zostanie puste, a pod nim pojawi się komunikat, że wpisu nie da się odczytać jako koloru CMYK, razem z przykładem czterech liczb. Tak samo zachowa się przy pięciu liczbach, bo konwerter nie zgaduje, którą z nich pominąć.
Czy kod HEX z tego konwertera nadaje się do CSS?
Tak. Wynik ma postać #RRGGBB, którą przyjmuje każda przeglądarka[2]. Przycisk Kopiuj wynik kopiuje sam kod razem z krzyżykiem.
Pomóż nam ulepszyć narzędzia
Masz pomysł na nową funkcję, widzisz błąd lub chcesz zaproponować inne narzędzie? Napisz do nas.