Porti presan paletron al la reto estas pli facila en HSL: kiam via ink-miksaĵo estas esprimita kiel nuanco, saturiĝo kaj lumiĝo, vi povas krei hover-statojn, tinetojn kaj ombrojn el ĝi en sekundoj.
Kiel funkcias konvertado de CMYK al HSL
- Konvertu la CMYK-procentaĵojn al RGB-kanaloj inter 0 kaj 255.
- Dividu la kanalojn per 255 kaj prenu ilian maksimumon kaj minimumon.
- La meznombro de maksimumo kaj minimumo estas la lumiĝo L, ilia disvastiĝo regas la saturiĝon S.
- La kanalo kiu havas la maksimumon determinas la nuancon H en gradoj sur la kolorrado.
Efektiva ekzemplo
La CMYK-al-RGB-paŝo jam estas aproksimado kaj HSL-valoroj estas rondigitaj al entjeroj. La rezulto estas tre proksima kongruo, ne kolor-administrita konverto.
CMYK kaj HSL klarigo
Kio estas CMYK?
CMYK estas la kvar-ink-modelo uzata en presado: cyan, magenta, flava kaj key (nigra), ĉiu kiel procento de 0 ĝis 100. Inko subtrahas lumon anstataŭ elsendi ĝin, do CMYK kovras malpli da koloroj ol ekrano — tial brileco de ekrano ofte ŝajnas malpli intensa post presado.
- Sintekso:
- cmyk(C%, M%, Y%, K%)
- Gamo:
- 0–100% po inko
- Plej taŭga por:
- presado, pakado, pretpor-presa artaĵo
Kio estas HSL?
HSL dividas koloron en nuancon (0–360° sur la kolorrado), saturiĝon (kiom kolora, 0–100%) kaj lumon (kiom hela, 0–100%). Ĉar ĉiu parto kongruas kun la maniero kiel homoj priskribas koloron, HSL estas la plej simpla formato por konstrui kolorkopiojn, nuancojn kaj konsekvencajn paletrojn — per mano aŭ en kodo.
- Sintekso:
- hsl(H, S%, L%)
- Gamo:
- 0–360°, 0–100%, 0–100%
- Plej taŭga por:
- paletroj, nuancoj kaj ombroj, temigado
CMYK al HSL referenctabelo
La plej oftaj CSS-koloroj, konvertitaj de CMYK al HSL.
| Koloro | CMYK | HSL |
|---|---|---|
| black | cmyk(0%, 0%, 0%, 100%) | hsl(0, 0%, 0%) |
| white | cmyk(0%, 0%, 0%, 0%) | hsl(0, 0%, 100%) |
| red | cmyk(0%, 100%, 100%, 0%) | hsl(0, 100%, 50%) |
| lime | cmyk(100%, 0%, 100%, 0%) | hsl(120, 100%, 50%) |
| blue | cmyk(100%, 100%, 0%, 0%) | hsl(240, 100%, 50%) |
| yellow | cmyk(0%, 0%, 100%, 0%) | hsl(60, 100%, 50%) |
| orange | cmyk(0%, 35%, 100%, 0%) | hsl(39, 100%, 50%) |
| teal | cmyk(100%, 0%, 0%, 50%) | hsl(180, 100%, 25%) |
| purple | cmyk(0%, 100%, 0%, 50%) | hsl(300, 100%, 25%) |
| gray | cmyk(0%, 0%, 0%, 50%) | hsl(0, 0%, 50%) |