ImageColorPicker.com

HEX uz HSL konvertors

Konvertē jebkuru HEX krāsu uz HSL — uzreiz un bez maksas

#2ECC71

Ielīmē jebkādu krāsas vērtību — mēs noteiksim formātu.

HSL rezultāts
Tonis
145°
Piesātinājums
63%
Gaišums
49%

Šī krāsa visos formātos

CMYK profils: Coated FOGRA39 (Photoshop noklusējums Eiropai)

HSL apraksta krāsu tā, kā par to runā cilvēki: kāds tonis, cik piesātināta, cik gaiša. HEX pārvēršana HSL ir ātrākais veids, kā iegūt krāsu formā, ko var reāli regulēt — izcelt, nomierināt vai izveidot no tās veselu skalu.

Kā darbojas HEX uz HSL konvertēšana

  1. Pārvērt HEX kodu RGB un katru kanālu dala ar 255, lai visi trīs būtu diapazonā no 0 līdz 1.
  2. Atrodi no trijām vērtībām lielāko un mazāko. To vidējā vērtība ir gaišums L.
  3. To starpība nosaka piesātinājumu S: dalīt ar (2 − max − min) gaišajām krāsām vai ar (max + min) tumšajām.
  4. Kanāls, kas satur maksimumu, nosaka toni H — sarkans 0°, zaļš 120°, zils 240° — un pārējie divi kanāli pozicionē toni šajā segmentā.

Praktisks piemērs

HEX #2ECC71=HSL hsl(145, 63%, 49%)

Matemātika ir precīza, bet HSL vērtības parasti noapaļo līdz veselām grādiem un procentiem. Pārvēršot atpakaļ, rezultāts var atšķirties par vienu vai diviem RGB soļiem — praksē nemanāmi, bet vērts zināt, ja krāsas regulāri griež šurpu‑turpu.

HEX un HSL izskaidrojums

Kas ir HEX?

HEX kods ir sešciparu heksadecimāls skaitlis, kas aiz vadības zīmes # glabā krāsas sarkanās, zaļās un zilās kanāla vērtības. Katra ciparu pāris attēlo vienu kanālu no 00 (nav) līdz FF (pilna), kas dod tos pašus 16.7 miljonus krāsu kā RGB, bet īsākā pierakstā. HEX ir noklusējums CSS, dizaina rīkos un zīmola vadlīnijās.

Sintakse:
#RRGGBB
Diapazons:
00–FF per channel
Vislabāk piemērots:
CSS, dizaina nodošana, zīmola vadlīnijas

Kas ir HSL?

HSL sadala krāsu toņos (0–360° krāsu ritenī), piesātinājumā (cik krāsaina, 0–100%) un gaišumā (cik spilgta, 0–100%). Tā kā katra daļa atbilst tam, kā cilvēki apraksta krāsu, HSL ir visvienkāršākais formāts tintiņu, nokrāsu un konsekventu paletju veidošanai — gan manuāli, gan kodā.

Sintakse:
hsl(H, S%, L%)
Diapazons:
0–360°, 0–100%, 0–100%
Vislabāk piemērots:
paletes, tintiņas un nokrāsas, tēmu veidošana

HEX uz HSL atsauces tabula

Visizplatītākās CSS krāsas, konvertētas no HEX uz HSL.

KrāsaHEXHSL
black#000000hsl(0, 0%, 0%)
white#FFFFFFhsl(0, 0%, 100%)
red#FF0000hsl(0, 100%, 50%)
lime#00FF00hsl(120, 100%, 50%)
blue#0000FFhsl(240, 100%, 50%)
yellow#FFFF00hsl(60, 100%, 50%)
orange#FFA500hsl(39, 100%, 50%)
teal#008080hsl(180, 100%, 25%)
purple#800080hsl(300, 100%, 25%)
gray#808080hsl(0, 0%, 50%)

Vairāk krāsu konvertoru

Bieži uzdotie jautājumi

Pārvērt HEX kodu RGB un katru kanālu dala ar 255, lai visi trīs būtu diapazonā no 0 līdz 1. Atrodi no trijām vērtībām lielāko un mazāko. To vidējā vērtība ir gaišums L. To starpība nosaka piesātinājumu S: dalīt ar (2 − max − min) gaišajām krāsām vai ar (max + min) tumšajām. Kanāls, kas satur maksimumu, nosaka toni H — sarkans 0°, zaļš 120°, zils 240° — un pārējie divi kanāli pozicionē toni šajā segmentā.

Matemātika ir precīza, bet HSL vērtības parasti noapaļo līdz veselām grādiem un procentiem. Pārvēršot atpakaļ, rezultāts var atšķirties par vienu vai diviem RGB soļiem — praksē nemanāmi, bet vērts zināt, ja krāsas regulāri griež šurpu‑turpu.

HSL sadala krāsu toņos (0–360° krāsu ritenī), piesātinājumā (cik krāsaina, 0–100%) un gaišumā (cik spilgta, 0–100%). Tā kā katra daļa atbilst tam, kā cilvēki apraksta krāsu, HSL ir visvienkāršākais formāts tintiņu, nokrāsu un konsekventu paletju veidošanai — gan manuāli, gan kodā.

Jā. Apmaiņas poga blakus ievadei ved uz HSL uz HEX konvertoru, kas darbojas tieši tāpat. Abas puses izmanto to pašu formulu, tikai piemēro to apgrieztā secībā.

Pārslēdzies uz HSL, tiklīdz nepieciešamas krāsas variācijas. Fiksējot H un S un mainot tikai L, iegūsi konsekventu nokrāsu un tonējumu skalu, ko HEX roku darbs ievērojami apgrūtina.