HEX to HSL converter

தேவையான HEX நிறத்தை HSL ஆக உடனுக்குடன் இலவசமாக மாற்று

#2ECC71

ஏதாவது நிற மதிப்பை ஒட்டுங்கள் — நாங்கள் அதன் வடிவத்தை தானாக கண்டுபிடிப்போம்.

HSL முடிவு
ஹூ
145°
சேச்சுரேஷன்
63%
லைட்னெஸ்
49%

இந்த நிறத்தின் அனைத்து வடிவங்களிலும்

CMYK சுயவிவரம்: Coated FOGRA39 (ஐரோப்பாவுக்கு Photoshop-இன் இயல்புநிலை)

HSL ஒரு நிறத்தை மக்கள் பேசும் முறையில் விவரிக்கிறது: எந்த hue, எவ்வளவு நிறமையாக்கம் (saturation), எவ்வளவு பிரகாசம். HEX குறியீட்டை HSL ஆக மாற்றுவது, அந்த நிறத்தை உண்மையாக மாற்றி சீரமைக்க—ஒளிரச் செய்வது, ஏற்படுத்துவது, அல்லது முழு அளவீட்டுத் தொடர் அமைப்பது—முடிவதற்கான கூடிய விரைவான வழி.

HEX ஐ HSL ஆக மாற்றுவது எப்படி

  1. HEX குறியீட்டை RGB-க்கு மாற்றி ஒவ்வொரு சேனலையும் 255-ஆக வகுக்கவும், ஆகவே மூன்றுமே 0 மற்றும் 1 என்ற வரையினுள் அமைவதாக இருக்கும்.
  2. மூன்றின் மிகப்பெரியதும் மிகச்சிறியதும் கண்டறியவும். அவை இரண்டின் சராசரி தான் வெளிச்சம் L.
  3. அவற்றின் இடைவேலையான வித்தியாசம் தான் சாந்தி S-ஐ இயக்குகிறது: லைட் நிறங்களுக்கு (2 − max − min) ஆல் வகுக்கவும், அல்லது டார்க் நிறங்களுக்கு (max + min) ஆல் வகுக்கவும்.
  4. அதிலுள்ள மிகுமையான சேனல் தான் hue H-ஐ தீர்மானிக்கும் — சென்று 0°, பச்சை 120°, நீலம் 240° — மற்ற இரண்டு சேனல்கள் அந்த பிரிவுக்குள் hue-ஐ எங்கே இடம் பெறுவோ அதை அமைக்கின்றன.

உதாரணம்

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

கணக்குகள் துல்லியமானவை, ஆனால் HSL மதிப்புகள் பொதுவாக முழு கோணங்கள் மற்றும் சதவீதமாக உர ROUND செயப்படுகின்றன. அதனால் பின்னர் மாற்றும்போது ஒரோ இரண்டு RGB படிகளால் விலகிக்கொள்ளலாம் — நடைமுறையில் இறையாளானது, ஆனால் நிறங்களை பல முறை முனையும் போது இது கவனத்தில் வைத்துக் கொள்ள வேண்டும்.

HEX மற்றும் HSL விளக்கம்

HEX என்ன?

HEX கோடு ஒரு ஆறு- எழுத்து ஹெக்சாதெசிமல் எண், இது # என்ற முன்னோட்டத்துடன் ஒரு நிறத்தின் சிவப்பு, பச்சை மற்றும் நீலம் சேனலைக் கொள்கிறது. ஒவ்வொரு இரட்டைப் பதிவும் ஒரு சேனலை குறிப்பதாகும், 00 (இல்லை) முதல் FF (முழு) வரை, இது RGB இன் 16.7 மில்லியன் நிறங்களைத் தருகிறது ஆனால் குறைந்த இடத்தில். HEX என்பது CSS, டிசைன் கருவிகள் மற்றும் பிராண்ட் வழிகாட்டுதல்களில் இயல்பானதாகும்.

வினியமைப்பு:
#RRGGBB
வரம்பு:
சேனலுக்கு 00–FF
சிறந்தது:
CSS, டிசைன் ஹான்ட்ஓஃப், பிராண்ட் வழிகாட்டுதல்கள்

HSL என்ன?

HSL ஒரு நிறத்தை மூன்று பகுதிகளாக பிரிக்கிறது: hue (நிற சக்கரத்தில் 0–360°), saturation (எவ்வளவு நிறமுள்ளதே, 0–100%) மற்றும் lightness (பொளி அளவு, 0–100%). ஒவ்வொரு பகுதியும் மனிதர்கள் நிறத்தை விவரிக்கும் முறை match ஆக இருப்பதால், HSL கையேடு அல்லது கோடில் திணி, ஷேடுகள் மற்றும் சீரான பேலெட்டுகளை உருவாக்க எளிதாக இருக்கும்.

வினியமைப்பு:
hsl(H, S%, L%)
வரம்பு:
0–360°, 0–100%, 0–100%
சிறந்தது:
பேலெட்டுகள், டிண்டுகள் மற்றும் ஷேடுகள், தீமை வேண்டும் வேலை

HEX -> HSL குறிப்பு அட்டவணை

அதிகப் பயன்படும் CSS நிறங்கள், HEX இலிருந்து HSL ஆக மாற்றப்பட்டவை.

நிறம்HEXHSL
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%)

அடிக்கடி கேட்கப்படும் கேள்விகள்

HEX குறியீட்டை RGB-க்கு மாற்றி ஒவ்வொரு சேனலையும் 255-ஆக வகுக்கவும், ஆகவே மூன்றுமே 0 மற்றும் 1 என்ற வரையினுள் அமைவதாக இருக்கும். மூன்றின் மிகப்பெரியதும் மிகச்சிறியதும் கண்டறியவும். அவை இரண்டின் சராசரி தான் வெளிச்சம் L. அவற்றின் இடைவேலையான வித்தியாசம் தான் சாந்தி S-ஐ இயக்குகிறது: லைட் நிறங்களுக்கு (2 − max − min) ஆல் வகுக்கவும், அல்லது டார்க் நிறங்களுக்கு (max + min) ஆல் வகுக்கவும். அதிலுள்ள மிகுமையான சேனல் தான் hue H-ஐ தீர்மானிக்கும் — சென்று 0°, பச்சை 120°, நீலம் 240° — மற்ற இரண்டு சேனல்கள் அந்த பிரிவுக்குள் hue-ஐ எங்கே இடம் பெறுவோ அதை அமைக்கின்றன.

கணக்குகள் துல்லியமானவை, ஆனால் HSL மதிப்புகள் பொதுவாக முழு கோணங்கள் மற்றும் சதவீதமாக உர ROUND செயப்படுகின்றன. அதனால் பின்னர் மாற்றும்போது ஒரோ இரண்டு RGB படிகளால் விலகிக்கொள்ளலாம் — நடைமுறையில் இறையாளானது, ஆனால் நிறங்களை பல முறை முனையும் போது இது கவனத்தில் வைத்துக் கொள்ள வேண்டும்.

HSL ஒரு நிறத்தை மூன்று பகுதிகளாக பிரிக்கிறது: hue (நிற சக்கரத்தில் 0–360°), saturation (எவ்வளவு நிறமுள்ளதே, 0–100%) மற்றும் lightness (பொளி அளவு, 0–100%). ஒவ்வொரு பகுதியும் மனிதர்கள் நிறத்தை விவரிக்கும் முறை match ஆக இருப்பதால், HSL கையேடு அல்லது கோடில் திணி, ஷேடுகள் மற்றும் சீரான பேலெட்டுகளை உருவாக்க எளிதாக இருக்கும்.

ஆம். உள்ளீட்டின் பக்கத்தில் இருக்கும் மாற்று பொத்தான் உன்னை HSL→HEX கன்வெர்டருக்கு எடுத்துச் செல்கிறது, அது முற்றிலும் அதேவாறு இயங்கும். இரு திசைகளும் ஒரே சூத்திரத்தைப் பயன்படுத்துகிறது, வெறும் முறையை மறுபடியாய் பயன்படுத்துவது மட்டுமே.

நிறத்தின் வேறுபாடுகள் தேவைப்படும் உடனே HSL-க்கு மாற்றுங்கள். H மற்றும் S-ஐ நிலைத்துவைத்து L மட்டும் நகர்த்தினால் உங்களுக்குத் தூயும் நல்ல tint மற்றும் shade அடுக்கு கிடைக்கும், இது HEX-ல் கைமுறையாக செய்வது மிகவும் கடினம்.