Egy nyomdai palettát webre vinni HSL-ben egyszerűbb: ha a tintakeverék árnyalatként, telítettségként és világosságként van kifejezve, pillanatok alatt építhetsz belőle hover állapotokat, tintákat és árnyalatokat.
Hogyan működik a CMYK → HSL átalakítás
- Alakítsd át a CMYK-százalékokat 0 és 255 közötti sRGB-csatornákká a Coated FOGRA39 profillal.
- Oszd el a csatornákat 255-tel, és vedd a maximumot és minimumot.
- A maximum és minimum átlaga adja a világosságot L-t, a kettő közti különbség állítja elő a telítettséget S-t.
- Az a csatorna, amelyik tartja a maximumot, határozza meg az árnyalatot H fokban a színkörön.
Példa a gyakorlatban
A CMYK-ból RGB-be tartó lépés a szabványos Coated FOGRA39 profilt használja, ezért más CMYK-profilok (például a nyomdádé) más értékeket adnak. A HSL-értékek egész számokra kerekítve jelennek meg.
CMYK és HSL magyarázata
Mi az a CMYK?
A CMYK a négy festékmodell nyomtatáshoz: cyan, magenta, yellow és key (fekete), mind százalékos értékként 0–100 között. A festék a fényt vonja ki a kibocsátás helyett, így a CMYK kevesebb színt képes megjeleníteni, mint egy képernyő — ezért a világos képernyőszínek gyakran tompábbnak tűnnek nyomtatásban.
- Szintaxis:
- cmyk(C%, M%, Y%, K%)
- Tartomány:
- 0–100% festékenként
- Legjobb erre:
- nyomtatás, csomagolás, nyomdai anyagok
Mi az a HSL?
A HSL a színt három részre bontja: hue (0–360° a színségen), saturation (mennyire színes, 0–100%) és lightness (mennyire világos, 0–100%). Mivel minden rész megfelel annak, ahogy az emberek a színt leírják, a HSL a legegyszerűbb formátum árnyalatok, tónusok és egységes paletták kézi vagy kód alapú létrehozásához.
- Szintaxis:
- hsl(H, S%, L%)
- Tartomány:
- 0–360°, 0–100%, 0–100%
- Legjobb erre:
- paletták, tónusok és árnyalatok, témázás
CMYK → HSL referencia táblázat
A leggyakoribb CSS-színek, átalakítva CMYK-ról HSL-ra.
| Szín | 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%) |