RGB-tik HSL-ra bihurgailua

Bihurtu edozein RGB kolore HSL-ra — berehala eta doan

#9B59B6

Itsatsi kolore balio edozein — guk zuretzat formatua antzematen dugu.

R
G
B
HSL emaitza
Tona
283°
Saturazioa
39%
Argitasuna
53%

Kolore hau formatu guztietan

CMYK profila: Coated FOGRA39 (Photoshop-en Europarako lehenetsia)

RGBek pantailari adierazten dio zein neurri argia igortzeko; HSLek esaten dizu kolorea nola agertzen den benetan. Kanal hiruak tonu, saturazio eta argitasun bihurtzeak kolorea eskuz moldatzea errazten du.

Nola funtzionatzen duen RGB-tik HSL-ra bihurketa

  1. Zatitu R, G eta B 255ekin, horrela balio bakoitza 0 eta 1 artean egongo da.
  2. Hartzen ezazu hiruen artean handiena eta txikiena — haien batezbestekoa da argitasuna L.
  3. Kasuetan handiena eta txikiena berdinak badira, kolorea griseko da: tonuak eta saturazioak 0 izango dira biak.
  4. Bestela, lortu S maximoaren eta minimoaren arteko tartearen arabera, eta irakurri H zein kanal den maximuma.

Adibide errealista

RGB rgb(155, 89, 182)=HSL hsl(283, 39%, 53%)

Printzipioz zehatza. H, S eta L normalean biribilduak erakusten direnez, atzera bihurtzeak kanal baten balioa pauso edo bi mugitu dezake.

RGB eta HSL azalduak

Zer da RGB?

RGB kolore bat hiru argi-kanal gisa deskribatzen du — gorri, berde eta urdin — bakoitza 0tik 255era. Pantailen funtzionamendua islatzen du: hirurak 255etan zuria ematen dute, guztiak 0an beltza. RGB egokia da kolerekin kalkulatu behar duzunean, eta rgba()k gardentasuna gehitzen du horren gainean.

Sintaxia:
rgb(R, G, B)
Tartea:
0–255 kanal bakoitzean
Egokiena:
kodea, canvas, gardentasuna rgba()arekin

Zer da HSL?

HSL kolorea hiru zatitan banatzen du: tonuak (0–360° kolore-zirkluan), saturazioak (zenbat kolore, 0–100%) eta argitasunak (zenbat distira, 0–100%). Zati bakoitzak gizakiek kolorea deskribatzeko modua islatzen duenez, HSL errazenetakoa da tints, shades eta koherentziazko paletak eskuz edo kode bidez sortzeko.

Sintaxia:
hsl(H, S%, L%)
Tartea:
0–360°, 0–100%, 0–100%
Egokiena:
paletak, tints eta shades, theming

RGB-tik HSL-ra erreferentzia-taula

Ohikoenak diren CSS koloreak, RGB-tik HSL-ra bihurtuak.

KoloreaRGBHSL
blackrgb(0, 0, 0)hsl(0, 0%, 0%)
whitergb(255, 255, 255)hsl(0, 0%, 100%)
redrgb(255, 0, 0)hsl(0, 100%, 50%)
limergb(0, 255, 0)hsl(120, 100%, 50%)
bluergb(0, 0, 255)hsl(240, 100%, 50%)
yellowrgb(255, 255, 0)hsl(60, 100%, 50%)
orangergb(255, 165, 0)hsl(39, 100%, 50%)
tealrgb(0, 128, 128)hsl(180, 100%, 25%)
purplergb(128, 0, 128)hsl(300, 100%, 25%)
grayrgb(128, 128, 128)hsl(0, 0%, 50%)

Maiz galdetzen diren galderak

Zatitu R, G eta B 255ekin, horrela balio bakoitza 0 eta 1 artean egongo da. Hartzen ezazu hiruen artean handiena eta txikiena — haien batezbestekoa da argitasuna L. Kasuetan handiena eta txikiena berdinak badira, kolorea griseko da: tonuak eta saturazioak 0 izango dira biak. Bestela, lortu S maximoaren eta minimoaren arteko tartearen arabera, eta irakurri H zein kanal den maximuma.

Printzipioz zehatza. H, S eta L normalean biribilduak erakusten direnez, atzera bihurtzeak kanal baten balioa pauso edo bi mugitu dezake.

HSL kolorea hiru zatitan banatzen du: tonuak (0–360° kolore-zirkluan), saturazioak (zenbat kolore, 0–100%) eta argitasunak (zenbat distira, 0–100%). Zati bakoitzak gizakiek kolorea deskribatzeko modua islatzen duenez, HSL errazenetakoa da tints, shades eta koherentziazko paletak eskuz edo kode bidez sortzeko.

Bai. Sarreraren ondoan dagoen truke botoiak eramango zaitu HSL-tik RGB-ra bihurtzaileara, eta modu berean funtzionatzen du. Bi norabideek formula bera erabiltzen dute, baina alderantziz aplikatuta.

HSL distiratsuagoa da kolore lotua behar duzunean, ez zehaztua: biratu H kolore osagarri baterako, jaitsi S bertsio apalago baterako, igo L hover egoitzarako.