HSL-től HEX-ig

Hasonlítsa össze a HSL-t a HEX-szel

A CSS 3 egy másik módszert mutat be a színek meghatározására a HSL segítségével (angolul: Hue, Saturation, Lightness). olyan modell, amelyben a színt három paraméter határozza meg: színárnyalat, telítettség és világosság. Vessünk egy pillantást az egyes paraméterekre külön-külön. A HSL legfontosabb előnye a színjellemzők egymástól független megadásának képessége. Ez hatalmas lehetőségeket nyit meg az Ön számára. Könnyedén fényesebbé, sötétebbé, telítettebbé vagy telítetlenebbé teheti a színt. És árnyékának megtartása mellett. Vagy fordítva - változtassa meg az árnyalatokat a telítettség vagy a fényerő megváltoztatása nélkül. Gyakran az előfeldolgozókat használják ilyen funkciók használatára, de ezek nélkül is lehetséges. A hsl () függvény a HSL színek megadására szolgál. A függvény három értéket vesz fel vesszővel elválasztva: színárnyalat, telítettség és világosság. A telítettség és a fényerő értékének megváltoztatásával szomszédos árnyalatokat kaphat egy adott színhez.

A legtöbb esetben egy színt hexadecimális kóddal lehet felismerni, a párok csak az első számjegyeit figyelembe véve. Az alábbi példában egyértelmű, hogy a szín sok vörös, egy kis kék és egyáltalán nem zöld színű. Ha a színeket hexadecimális kóddal értjük, akkor a webdesigner gyorsabban navigálhat az oldal kódjában, és emellett mindig lenyűgözheti kollégáit vagy ügyfeleit azzal, hogy Ah, milyen csodálatos bordó árnyalatú. Könnyedén megváltoztathatja a szín fényerejét, árnyalatát vagy telítettségét, ha csak a hexadecimális kódot szerkeszti. Az alábbi első példában az egyik pár 10% -os lépésekben változik, miközben a szín fényereje növekszik. A második példában a fényerő nő, de a telítettség csökken. Az RGB értékek hexadecimális (HEX) színértékek segítségével is meghatározhatók a következő formában: #RRGGBB, ahol az RR (piros), GG (zöld) és BB (kék) hexadecimális értékek 00 és FF között (megegyeznek a decimális 0- 255). A hexadecimális rendszer - ellentétben a tizedesrendszerrel -, ahogy a neve is mutatja, a 16-os számra épül.