Trükipaleti toomine veebilehele on HSL‑is lihtsam: kui sinu tindisegu on väljendatud hue, saturation ja lightness‑ina, saad sekunditega ehitada hover‑seisundeid, tinti ja shade'e.
Kuidas CMYK -> HSL teisendamine toimib
- Teisenda CMYK-protsendid profiiliga Coated FOGRA39 sRGB kanaliteks vahemikus 0 kuni 255.
- Jaga kanalid 255‑ga ja võta nende maksimum ja miinimum.
- Maksimumi ja miinimumi keskmine on lightness L, nende vahe määrab saturation S.
- Kanali, millel on maksimum, põhjal määratakse hue H kraadides värvirattal.
Töötav näide
Samm CMYK-st RGB-ks kasutab standardset profiili Coated FOGRA39, seega teised CMYK-profiilid (näiteks sinu trükikojast) annavad teistsuguseid numbreid. HSL-väärtused ümardatakse täisarvudeni.
CMYK ja HSL selgitatud
Mis on CMYK?
CMYK on trükis kasutatav nelja-tindi mudel: cyan, magenta, yellow ja key (must), igaüks protsentides 0–100. Tint lahutab valgust rather than emit, seetõttu katab CMYK vähem toone kui ekraan — seetõttu näevad erksad ekraanivärvid sageli trükis tuhmid välja.
- Süntaks:
- cmyk(C%, M%, Y%, K%)
- Vahemik:
- 0–100% per tint
- Parim jaoks:
- trükk, pakendikujundus, trükiks valmis artwork
Mis on HSL?
HSL jagab värvi tooniks (0–360° värvirattal), küllastuseks (kui erksas, 0–100%) ja heleduseks (kui hele, 0–100%). Kuna iga osa peegeldab seda, kuidas inimesed värve kirjeldavad, on HSL kõige lihtsam vorming varjundite, toonide ja järjepidevate palettide loomiseks — käsitsi või koodis.
- Süntaks:
- hsl(H, S%, L%)
- Vahemik:
- 0–360°, 0–100%, 0–100%
- Parim jaoks:
- paletid, toonid ja varjundid, teematöö
CMYK -> HSL võrdlustabel
Kõige levinumad CSS-värvid, teisendatud CMYK formaadist HSL formaati.
| Värv | 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%) |