Přenést tiskovou paletu na web je v HSL jednodušší: jakmile máš mix inkoustu vyjádřený jako odstín, sytost a světlost, můžeš z něj za sekundy vytvořit hover stavy, tinty a stíny.
Jak funguje převod z CMYK na HSL
- Převeď procenta CMYK na kanály sRGB v rozsahu 0 až 255 pomocí profilu Coated FOGRA39.
- Vyděl kanály 255 a vezmi jejich maximum a minimum.
- Průměr maxima a minima je světlost L, jejich rozptyl určuje sytost S.
- Kanál s maximální hodnotou určuje odstín H v stupních na barevném kruhu.
Ukázkový příklad
Krok z CMYK na RGB používá standardní profil Coated FOGRA39, takže jiné profily CMYK (například od tvé tiskárny) dávají jiná čísla. Hodnoty HSL jsou zaokrouhleny na celá čísla.
CMYK a HSL vysvětleno
Co je CMYK?
CMYK je model čtyř barev používaný v tisku: cyan, magenta, yellow a key (černá), každý jako procento od 0 do 100. Inkoust odečítá světlo místo jeho emitování, takže CMYK pokrývá méně barev než obrazovka — proto jasné barvy na obrazovce často vypadají po tisku mdlěji.
- Syntaxe:
- cmyk(C%, M%, Y%, K%)
- Rozsah:
- 0–100% na inkoust
- Nejlepší pro:
- tisk, balení, podklady připravené pro tisk
Co je HSL?
HSL rozděluje barvu na odstín (hue, 0–360° na barevném kruhu), sytost (saturation, jak barevná, 0–100%) a jas (lightness, jak světlá, 0–100%). Protože každá část odpovídá způsobu, jak lidé barvy popisují, je HSL nejjednodušší formát pro vytváření odstínů, tónů a konzistentních palet — ručně i v kódu.
- Syntaxe:
- hsl(H, S%, L%)
- Rozsah:
- 0–360°, 0–100%, 0–100%
- Nejlepší pro:
- palety, odstíny a tóny, theming
Referenční tabulka CMYK na HSL
Nejběžnější CSS barvy převedené z CMYK na HSL.
| Barva | CMYK | HSL |
|---|---|---|
| black | cmyk(89%, 78%, 62%, 97%) | hsl(0, 0%, 0%) |
| white | cmyk(0%, 0%, 0%, 0%) | hsl(0, 0%, 100%) |
| red | cmyk(0%, 95%, 92%, 0%) | hsl(1, 79%, 51%) |
| lime | cmyk(64%, 0%, 100%, 0%) | hsl(93, 60%, 44%) |
| blue | cmyk(93%, 75%, 0%, 0%) | hsl(224, 56%, 39%) |
| yellow | cmyk(9%, 0%, 96%, 0%) | hsl(57, 100%, 48%) |
| orange | cmyk(0%, 43%, 94%, 0%) | hsl(37, 93%, 53%) |
| teal | cmyk(83%, 27%, 48%, 12%) | hsl(180, 87%, 27%) |
| purple | cmyk(63%, 100%, 4%, 1%) | hsl(299, 58%, 31%) |
| gray | cmyk(48%, 39%, 39%, 21%) | hsl(30, 1%, 50%) |