CSS3 nam donosi HSL model boja
Tek skoro sam primetio da nam CSS3 specifikacija izmedju ostalog donosi i HSL model boja. Kompletan CSS Color Module Level 3 imate ovde. Imali smo od ranije color: rgb(255,0,0), sad imamo i color: rgba(255,0,0,1), koji nam dodaje i opacity na boju.
color: rgb(255,0,0); color: rgba(255,0,0,1)
E sad, zasto je HSL bitan, prosto HSL je “prirodan model boja”, nema potreba da skacete u photoshop (ili gde vec) po nove #hex vrednosti, ili rgb vrednosti, jednostavno “podesavate”, dok ne dobijete zeljenu boju.
Evo ga primer sa w3 sajta, …
* { color: hsl(0, 100%, 50%) } /* red */
* { color: hsl(120, 100%, 50%) } /* green */
* { color: hsl(120, 100%, 25%) } /* dark green */
* { color: hsl(120, 100%, 75%) } /* light green */
* { color: hsl(120, 75%, 75%) } /* pastel green, and so on */
HSL je skracenica za hue-saturation-lightness, namestite zeljenu vrednost (hue) i jednostavno podesavate zasicenje i svetlinu boje. ql.