HEX-ஐ HSL ஆக மாற்றுதல் Hexadecimal ↔ Hue Saturation Lightness இலவசம் ஆன்லைன் பாதுகாப்பு
HEX-இல் ஒரு மதிப்பை எழுதுங்கள், அதே இடத்தில் HSL ஆகப் படித்துக்கொள்ளுங்கள். கணக்கு உங்கள் உலாவியிலேயே நடக்கிறது, எங்கும் எதுவும் அனுப்பப்படுவதில்லை, விடை எதைச் சார்ந்தது என்பது ஊகிக்கப்படாமல் கீழே எழுதப்பட்டுள்ளது.
எதுவும் பதிவேற்றப்படுவதில்லை
இந்தக் குறியீட்டு முறைகள் எங்கிருந்து வந்தன
ஹெக்ஸ்ஸும் RGB-யும் ஒரே பொருளை இரு முறை எழுதியவை. திரையின் நிறம் என்பது மூன்று எண்கள் — சிவப்பு, பச்சை, நீல ஒளியை எவ்வளவு வெளியிட வேண்டும் — ஒவ்வொன்றும் 0 முதல் 255 வரை, அதாவது ஒரு பைட்; ஹெக்ஸ் அந்த பைட்களைப் பதினாறு அடிப்படையில் எழுதுகிறது அவ்வளவே; எனவே #FF8800-உம் rgb(255, 136, 0)-உம் ஒரே படவணுவுக்குத் தரப்பட்ட ஒரே கட்டளை. HSL கண்டுபிடிக்கப்பட்டது, இவை இரண்டுமே மனிதனால் வாசிக்கப்பட முடியாதவை என்பதால்தான்: அது நிறத்தை நிறச் சக்கரத்தின் கோணமாகவும், தெவிட்டலையும் ஒளிர்வையும் விழுக்காடாகவும் தருகிறது; எனவே வடிவமைப்பாளர் மூன்று எண்களையும் மறுகணக்கிடாமலே ஒன்றை வெளிர்விக்க முடியும். CMYK முற்றிலும் வேறு உலகுக்கு உரியது — ஒளிக்கு அல்ல, மையிற்கு. அது கழித்தல் முறையிலானது; நான்கு அச்சுத் தகடுகளால் கட்டப்பட்டது; திரை தரக்கூடிய ஒவ்வொரு நிறத்தையும் அடைய முடியாது — ஏனெனில் திரை ஒளியை வெளியிடுகிறது, காகிதமோ அதை எதிரொளிப்பதோடு சரி.
இவற்றை எங்கே சந்திப்பீர்கள்
ஹெக்ஸ் என்பதே நீங்கள் பாணித் தாளில் தட்டச்சு செய்வது, வடிவமைப்புக் கருவி உங்களிடம் தருவது. RGB, நிறத்துக்குக் கணக்கு தேவைப்படும் எவ்விடத்திலும் தோன்றுகிறது: சாய்வு நிறங்கள், ஒளிஊடுருவல், ஒரு சாயலைக் கணக்கிடும் நிரல். HSL-ஐ நோக்கிக் கை நீள்வது, ஒரு நிறத்தட்டைக் கையால் சரிசெய்யும்போது; ஏனெனில் நாம் விரும்பும் மாற்றங்கள் பெரும்பாலும் அதன் மூன்று எண்களுள் ஒன்றின் மாற்றமே. CMYK என்பது அச்சகம் கேட்பது; அதற்கு மாற்றும் கணமே, ஒரு வடிவமைப்பு ஒளியாக இருப்பதை நிறுத்தி மையாக மாறும் கணம்.
அடிக்கடி கேட்கப்படும் கேள்விகள்
என் CMYK முடிவு அச்சகம் தருவதிலிருந்து ஏன் வேறுபடுகிறது?
ஏனெனில் சரியான மாற்றம் என ஒன்றே ஒன்று இல்லை. இந்தப் பக்கத்தின் கணக்கு, சாதனத்தைச் சாராத எளிய கணக்கு; ஒரு தொடக்கப் புள்ளியோ தோராயமான இணையோ தேவைப்படும்போது அதுவே சரியான விடை. அச்சகம் ஒரு நிறச் சுயவிவரத்தின் வழியே மாற்றுகிறது; அது குறிப்பிட்ட மை, காகிதம், அச்சு இயந்திரம் ஆகியவற்றைக் கணக்கில் கொள்கிறது. அதே RGB நிறம், பளபளப்புக் காகிதத்தில் ஒரு CMYK மதிப்பையும், பூச்சில்லாக் காகிதத்தில் வேறொன்றையும் தரும். சரியாகப் பொருந்த வேண்டிய எதற்கும், ஒரு சூத்திரத்தை நம்பாமல் அச்சகத்திடம் அவர்களின் சுயவிவரத்தைக் கேளுங்கள்.
திரையின் சில நிறங்களை ஏன் அச்சிட முடியாது?
ஏனெனில் இரண்டும் ஒரே நிறங்களை எட்டுவதில்லை. திரை ஒளியைக் கூட்டி நிறத்தை உருவாக்குகிறது; மையால் ஒருபோதும் ஈடுசெய்ய முடியாத பிரகாசமான, தெவிட்டிய நீலப்பச்சையையோ பச்சையையோ தர முடியும். காகிதம் ஒளியை உறிஞ்சி நிறத்தை உருவாக்குகிறது; அது எட்டக்கூடிய மிகப் பிரகாசமான நிலை, தாளின் வெண்மைதான். ஒவ்வொன்றும் எட்டக்கூடிய நிறங்களின் தொகுதிக்கு «கேமட்» என்று பெயர்; அவை ஒன்றையொன்று மேவாத இடத்தில், மாற்றம் கிடைக்கக்கூடிய மிக அருகிலுள்ள நிறத்தைத் தேர்வு செய்யவே வேண்டும். திரையில் பிரகாசமாகத் தெரியும் நிறம் அச்சில் சற்று மங்கலாகத் தோன்றுவதற்குக் காரணம் அதுவே.
விடை துல்லியமானதா?
இரு அலகுகளும் முழு எண்களால் ஒன்றையொன்று வரையறுக்கும் இடத்தில் ஆம் — பக்கம் அதை எண்ணுக்கு மேலே சொல்கிறது, வட்டமிடல் என்பது எத்தனை இலக்கங்கள் காட்டப்படுகின்றன என்பதில் மட்டுமே. விகிதத்துக்கு முடிவுறு தசமம் இல்லாத இடத்தில், பக்கம் பன்னிரண்டு கணிசமான இலக்கங்களைக் காட்டி, தொடர்பு தோராயமானது என்று சொல்கிறது — வேறு மாதிரி நடிப்பதில்லை.
நான் தட்டச்சு செய்வது என் சாதனத்தை விட்டு வெளியேறுகிறதா?
இல்லை. கணக்கு உங்கள் உலாவியிலேயே நடக்கிறது; எதுவும் பதிவேற்றப்படுவதில்லை, பதிவேற்ற ஒரு வழங்கியும் இல்லை. பக்கத்தை ஒருமுறை ஏற்றினால், இணையத்தை அணைத்தாலும் வேலை செய்யும்.
நீங்கள் ஏன் HEX ஐ HSL ஆக மாற்றுகிறீர்கள்
#5A4632 போன்ற ஒரு ஹெக்ஸ் குறியீடு ஒரு நிறத்தைச் சேமிக்க ஒரு நல்ல வழி, ஒன்றைப் பற்றிச் சிந்திக்க ஒரு மோசமான வழி. இலக்கங்களில் எதுவும் நிறம் ஒரு பழுப்பு என்றோ, அது எவ்வளவு பிரகாசமானது என்றோ, சற்று வெளிறிய பதிப்பு எப்படித் தோன்றும் என்றோ சொல்வதில்லை. HSL அதைச் சரிசெய்யக் கண்டுபிடிக்கப்பட்டது. அது மக்கள் ஒரு நிறத்தைப் பற்றிப் பேச முனையும் விதத்தில் அதை விவரிக்கிறது: எந்தச் சாயல், எவ்வளவு துடிப்பானது, எவ்வளவு இலகுவானது. HEX ஐ HSL ஆக மாற்றுவது என்பது ஒரு வடிவமைப்புக் கருவி உங்களுக்குத் தரும் வடிவத்திலிருந்து நீங்கள் காரணம் காணக்கூடிய வடிவத்துக்கு ஒரு நிறத்தை மொழிபெயர்ப்பது: hsl(30, 29%, 28%) என்பது ஓர் இருண்ட, மங்கலான ஆரஞ்சு-பழுப்பு, கடைசி எண்ணை உயர்த்தினால் அது வெளிறும் என்று நீங்கள் உடனே காணலாம்.
வடிவமைப்பாளர்களும் முன்பக்க உருவாக்குநர்களும் இந்த மாற்றத்தைப் பயன்படுத்துவதற்கான உண்மையான காரணம் அதுவே. அவர்களிடம் ஹெக்ஸில் ஒரு வணிக நிறம் உள்ளது, தொடர்புடைய நிறங்களின் ஒரு குடும்பம் தேவை: நகர்த்தும் நிலைக்கு ஓர் இலகுவானது, அழுத்தப்பட்ட பொத்தானுக்கு ஓர் இருண்டது, பின்னணிச் சாயலுக்கு ஒரு மிக வெளிறியது, முடக்கப்பட்ட கட்டுப்பாட்டுக்கு ஒரு செறிவு குறைந்தது. ஹெக்ஸில், இவற்றில் ஒவ்வொன்றும் மூன்று இலக்கச் சோடிகளுக்கான ஒரு புதிய வேட்டை. HSL இல், ஒவ்வொன்றும் ஒரு எண்ணுக்கான மாற்றம். நிறம் அதே நிறம், ஒரு மிகப் பயனுள்ள வில்லையினூடே பார்க்கப்படுகிறது.
இந்தப் பக்கம் உங்கள் உலாவிக்குள் மாற்றுகிறது, எதுவும் பதிவேற்றப்படுவதில்லை. கீழே HSL இன் மூன்று எண்கள் ஹெக்ஸ் இலக்கங்களிலிருந்து எப்படிக் கணக்கிடப்படுகின்றன, மாற்றம் எதைக் காக்கிறது, எங்குச் சுற்றுகிறது, சாயல், செறிவு, ஒளிர்வு நடைமுறையில் என்ன பொருள், வடிவமைப்பாளர்கள் தட்டுகளையும் நிலைகளையும் கட்ட HSL ஐ எப்படிப் பயன்படுத்துகிறார்கள், முதல்முறை HEX ஐ HSL ஆக மாற்றுபவர்களைச் சிக்க வைக்கும் பொறிகளைக் காண்பீர்கள்.
HSL எதை விவரிக்கிறது
சாயல்: நிறச் சக்கரத்தில் இடம்
சாயல் என்பது ஒரு நிறச் சக்கரத்தைச் சுற்றி 0 முதல் 360 பாகை வரையிலான ஒரு கோணம். சிவப்பு 0 இல், மஞ்சள் 60 இல், பச்சை 120 இல், சியான் 180 இல், நீலம் 240 இல், மெஜந்தா 300 இல் அமர்கின்றன; 360 இல் நீங்கள் மீண்டும் சிவப்பில் இருக்கிறீர்கள். 30 இன் சாயல் சிவப்புக்கும் மஞ்சளுக்கும் இடையே, அது ஆரஞ்சு. எண் நீங்கள் எந்த நிறக் குடும்பத்தில் இருக்கிறீர்கள் என்று சொல்கிறது, அது எவ்வளவு பிரகாசமானது அல்லது வெளிறியது என்பதைப் பற்றி எதுவும் சொல்வதில்லை.
செறிவு: எவ்வளவு துடிப்பானது
செறிவு ஒரு சதவீதம். 100% இல் நிறம் சாயல் அனுமதிக்கும் அளவுக்குத் தூய்மையானது; 0% இல் அது தன் எல்லா நிறத்தையும் இழந்து ஒரு சாம்பல். எங்கள் எடுத்துக்காட்டுப் பழுப்பில் உள்ளது போல 29% செறிவு ஒரு மங்கலான, மண் நிறம். செறிவைக் குறைப்பது ஒரு சத்தமான நிறத்தை அதன் இயல்பை மாற்றாமல் அமைதியாக்கும் விரைவு வழி.
ஒளிர்வு: எவ்வளவு வெளிறியது அல்லது இருண்டது
ஒளிர்வும் ஒரு சதவீதம். 0% இல் நிறம் சாயலும் செறிவும் எதுவாயினும் கறுப்பு; 100% இல் அது வெள்ளை; 50% இல் அது முழுமையான, இயல்பான நிறம். எங்கள் பழுப்பு 28% இல் இருண்ட பக்கத்தில் உள்ளது. எண்ணை உயர்த்துவது அதே நிறத்தின் வெளிறிய பதிப்பைத் தருகிறது, குறைப்பது இருண்டதை, அது வடிவமைப்பாளர்கள் மிக அடிக்கடி விரும்பும் மாற்றம்.
அது ஹெக்ஸைவிட ஏன் எளிது
ஹெக்ஸில், ஒரு நிறத்தை வெளிறச் செய்வது என்பது சாயல் விலகாமல் இருக்க மூன்று சோடிகளையும் வெவ்வேறு அளவுகளால் அதிகரிப்பது, கண்ணால் செய்வது கிட்டத்தட்ட இயலாதது. HSL இல் அது ஒரு தனி எண்ணை மாற்றி மற்ற இரண்டையும் தனியாக விடுவது.
மாற்றம் எவ்வாறு செயல்படுகிறது
மூன்று பைட்டுகளிலிருந்து ஒரு கோணத்துக்கும் இரு சதவீதங்களுக்கும்
மாற்றி முதலில் ஹெக்ஸ் இலக்கங்களைச் சிவப்பு, பச்சை, நீல மதிப்புகளாக, ஒவ்வொன்றும் 0 முதல் 255 வரை, வாசித்து, அவற்றை 0 க்கும் 1 க்கும் இடையே அளவிடுகிறது. அது மூன்றில் மிகப் பெரியதையும் மிகச் சிறியதையும் கண்டறிகிறது. ஒளிர்வு இரண்டின் சராசரி. செறிவு அவை எவ்வளவு தொலைவில் உள்ளன என்பதைப் பொறுத்தது, ஒளிர்வுடன் ஒப்பிடும்போது. சாயல் எந்த நாளம் பெரியது, மற்ற இரண்டும் எப்படி ஒப்பிடுகின்றன என்பதைப் பொறுத்தது. மூன்றும் சமமாக இருந்தால், நிறம் சாம்பல், செறிவு பூஜ்ஜியம், சாயலுக்குப் பொருள் இல்லை; மாற்றி அப்போது அதற்கு 0 ஐக் காட்டுகிறது.
எடுத்துக்காட்டு
#5A4632 க்குப் பைட்டுகள் 90, 70, 50. சிவப்பு 0.353 இல் பெரியது, நீலம் 0.196 இல் சிறியது. ஒளிர்வு அவற்றின் கூட்டுத்தொகையின் பாதி, 0.275, ஏறத்தாழ 28%. பரவல் 0.157, எனவே செறிவு 0.157 ஐக் கூட்டுத்தொகை 0.549 ஆல் வகுத்தது, ஏறத்தாழ 29%. சிவப்பு மிகப் பெரிய நாளம், பச்சை இடையே உள்ளது, அது சாயலை 30 பாகையில் வைக்கிறது. முடிவு hsl(30, 29%, 28%).
முழு எண்கள்
மூன்று எண்களும் எழுதப்படும்போது முழுப் பாகைகளுக்கும் முழு சதவீதங்களுக்கும் சுற்றப்படுகின்றன. அது மக்கள் பயன்படுத்தும் வடிவம், அன்றாட வேலையில் CSS எதிர்பார்க்கும் வடிவம், ஆனால் அடுத்த பகுதி விளக்குவது போல், கடைசி இலக்கத்தில் சில தகவல் தள்ளப்படுகிறது என்று அது பொருள்.
மாற்றம் எதைக் காக்கிறது, எதைக் காக்க முடியாது
கண் வரிசைப்படுத்துவது போல நிறத்தை அது காக்கிறது
முடிவு கண் வரிசைப்படுத்துவது போன்ற நிறம்: சக்கரத்தில் ஒரு சாயல், அது எவ்வளவு செறிவானது, எவ்வளவு இலகுவானது. அதனால்தான் HSL ஐ வைத்திருப்பது தகுதியானது. ஒரு எண்ணை மாற்றுவதன் மூலம் ஒரு நிறத்தை வெளிறச் செய்யலாம் அல்லது ஒரு நிழலை இருண்டதாக்கலாம், ஹெக்ஸில் அது கிட்டத்தட்ட இயலாதது.
அதே பைட்டுகளைத் திரும்பத் தருவதாக அது வாக்களிக்க முடியாது
இரண்டும் ஒரே நிறங்களை விவரிக்கின்றன, ஆனால் HSL அவற்றை ஒரு வேறுபட்ட வடிவியலினூடே அடைகிறது, அதன் மூன்று எண்களும் எழுதப்படும்போது முழுப் பாகைகளுக்கும் முழு சதவீதங்களுக்கும் சுற்றப்படுகின்றன. எனவே HSL க்கு எடுத்துச் சென்று திரும்பக் கொண்டுவரப்பட்ட ஒரு நிறம் அது தொடங்கிய இடத்திலிருந்து ஒரு அல்லது இரு படிகள் தொலைவில் வந்து சேரலாம்: பார்வையில் ஒன்றே, பைட்டுக்குப் பைட் ஒன்றல்ல. உங்களுக்குத் துல்லியப் பைட்டுகள் திரும்பத் தேவைப்பட்டால், ஹெக்ஸை வைத்திருங்கள். ஒரு நிறத்துடன் வேலை செய்ய HEX ஐ HSL ஆக மாற்றி, ஹெக்ஸை மூலப் படியாக வைத்திருங்கள்.
சாம்பல்களுக்குச் சாயல் இல்லை
மூன்று பைட்டுகளும் சமமாக இருக்கும்போது, சாயலைப் பற்றிச் சொல்ல எதுவும் இல்லை. மாற்றி 0 இன் சாயலையும் 0% செறிவையும் தருகிறது, ஒளிர்வு மட்டுமே சாம்பலை விவரிக்கிறது. 0 இல் எதையும் வாசிக்காதீர்கள்.
நடைமுறையில் HSL ஐப் பயன்படுத்துதல்
நிழல்களின் ஒரு குடும்பத்தைக் கட்டுதல்
அடிப்படை நிறம் hsl(30, 29%, 28%) ஐ எடுங்கள். நகர்த்தலுக்கு ஓர் இலகுவான நிழல் hsl(30, 29%, 34%). பின்னணிக்கு ஒரு மிக வெளிறிய சாயல் hsl(30, 29%, 94%). அழுத்தப்பட்ட நிலைகளுக்கு ஓர் இருண்ட நிழல் hsl(30, 29%, 22%). சாயலும் செறிவும் அப்படியே இருக்கின்றன, எனவே நிறங்கள் வெளிப்படையாக ஒன்றாகச் சேர்ந்தவை. ஹெக்ஸில் அதையே செய்வது பல முயற்சிகள் எடுக்கும், இன்னும் சற்றுத் தவறாகத் தோன்றும்.
கருப்பொருளும் இருண்ட பயன்முறையும்
ஒரு கருப்பொருளுக்குப் பெரும்பாலும் ஒரே தட்டு ஓர் ஒளிர் பதிப்பிலும் ஓர் இருண்ட பதிப்பிலும் தேவை. HSL உடன், நீங்கள் சாயலை வைத்து ஒளிர்வையும் செறிவையும் சரிசெய்கிறீர்கள்: ஒளிர் கருப்பொருளுக்குப் பின்னணிகளை இலகுவாக்கி உரையை இருண்டதாக்குங்கள், இருண்டதுக்கு எதிர்மாறாக. சாயலை ஒரு தனிப்பயன் பண்பாக வரையறுத்து ஒளிர்வை மட்டும் மாற்றுவது அதைச் செய்ய ஒரு பொதுவான, நேர்த்தியான வழி.
தட்டுகளை உருவாக்குதல்
ஓர் அடிப்படையுடன் செல்லும் நிறங்களைக் கண்டறிய, சாயலைச் சுழற்றுங்கள். இருபுறமும் முப்பது பாகை ஒத்த நிறங்களைத் தருகிறது, 180 நிரப்பியைத் தருகிறது, 120 அல்லது 240 ஒரு மூவகையைத் தருகின்றன. செறிவையும் ஒளிர்வையும் நிர்ணயித்து, சாயலை மாற்றுங்கள், நிறங்கள் ஓர் ஒருமித்த உணர்வைக் கொண்டிருக்கும். சீரற்றதாகத் தோன்றாத ஒரு தட்டைத் தொடங்க இது ஒரு விரைவு வழி.
அணுகக்கூடிய முரண்பாடு
முரண்பாட்டுக்கு ஒளிர்வே முக்கியக் கட்டுப்பாடு. ஒரு நிறப் பின்னணியில் உரையை வாசிப்பது கடினமாக இருந்தால், அவற்றுக்கிடையே ஒளிர்வு வேறுபாட்டை அதிகரிப்பதே பொதுவாகத் தீர்வு, HSL அதை ஒவ்வொரு பக்கத்திலும் ஒரு எண்ணைச் சரிசெய்வதாக்குகிறது.
இங்கே HEX ஐ HSL ஆக மாற்றுவது எப்படி
ஹெக்ஸ் குறியீட்டைத் தட்டச்சு செய்யுங்கள் அல்லது ஒட்டுங்கள்
முதல் புலத்தில் நிறத்தை, ஹாஷ் குறியுடனோ இல்லாமலோ, உள்ளிடுங்கள். மூன்று, ஆறு இலக்க வடிவங்கள் ஏற்கப்படுகின்றன, ஊடுருவும் தன்மையுடன் எட்டு இலக்க வடிவமும் வாசிக்கப்படுகிறது.
hsl மதிப்பைப் படியுங்கள்
விடை உடனே தோன்றுகிறது, #5A4632 = hsl(30, 29%, 28%) போல. மூன்று எண்கள் பாகைகளில் சாயலும் சதவீதத்தில் செறிவும் ஒளிர்வும்.
அதை உங்கள் நடைத் தாளில் நகலெடுங்கள்
முடிவை அது இருப்பதுபோலவே, color: hsl(30, 29%, 28%) போன்ற ஒரு விதியில், பயன்படுத்துங்கள். நிறத்தைச் சரிசெய்ய, கடைசி எண்ணை மாற்றுங்கள். எதிர்த் திசைக்கான கருவி HSL ஐ HEX ஆக.
இந்தக் குறிமுறைகள் எங்கிருந்து வருகின்றன
ஹெக்ஸும் RGB யும் இருமுறை எழுதப்பட்ட ஒரே விஷயம்
ஒரு திரை நிறம் என்பது மூன்று எண்கள், எவ்வளவு சிவப்பு, பச்சை, நீல ஒளியை உமிழ வேண்டும், ஒவ்வொன்றும் 0 முதல் 255 வரை, அது ஒரு பைட். ஹெக்ஸ் வெறுமனே அந்தப் பைட்டுகளைப் பதினாறு அடிப்படையில் எழுதுகிறது. எண்களைப் பார்க்க, HEX ஐ RGB ஆக மாற்றுங்கள்.
HSL உம் CMYK உம்
HSL கண்டுபிடிக்கப்பட்டது ஏனெனில் இரண்டில் எதுவும் ஒரு மனிதனுக்கு வாசிக்கக்கூடியதல்ல: அது நிறச் சக்கரத்தைச் சுற்றி ஒரு கோணமாகச் சாயலையும், சதவீதங்களாகச் செறிவையும் ஒளிர்வையும் தருகிறது, எனவே ஒரு வடிவமைப்பாளர் மூன்று எண்களை மீண்டும் கணக்கிடாமல் ஏதாவது ஒன்றை இலகுவாக்கலாம். CMYK முற்றிலும் வேறுபட்ட உலகத்துக்குரியது, ஒளி அல்ல, மை. அது கழிக்கும் முறை, நான்கு அச்சுத் தகடுகளால் கட்டப்பட்டது, ஒரு திரை காணக்கூடிய ஒவ்வொரு நிறத்தையும் அதனால் எட்ட முடியாது, ஏனெனில் ஒரு திரை ஒளியை உமிழ்கிறது, காகிதம் அதைப் பிரதிபலிக்க மட்டுமே செய்கிறது.
HEX ஐ HSL ஆக மாற்றும்போது பொறிகள்
ஒரு சரியான சுற்றுப் பயணத்தை எதிர்பார்த்தல்
சுற்றலால், திரும்ப மாற்றுவது அசலிலிருந்து ஒரு அல்லது இரு படிகள் தொலைவிலுள்ள ஒரு குறியீட்டைத் தரலாம். ஒரு தனி நிறத்துக்கு அது புலப்படாதது. பல நிறங்கள் முன்னும் பின்னும் மாற்றப்படும் ஒரு வடிவமைப்பு அமைப்புக்கு, அது குவியலாம். ஹெக்ஸை மூலமாக வைத்திருங்கள்.
சம ஒளிர்வு என்பது சமப் பிரகாசம் என்று கருதுதல்
ஒரே HSL ஒளிர்வு கொண்ட இரு நிறங்கள் பிரகாசத்தில் மிக வேறுபட்டுத் தோன்றலாம்: 50% இல் ஒரு மஞ்சள் 50% இல் ஒரு நீலத்தைவிட மிகப் பிரகாசமாகத் தோன்றுகிறது. HSL ஒளிர்வு ஒரு வசதியான எண், உணரப்படும் பிரகாசத்தின் அளவீடு அல்ல. முரண்பாட்டுச் சோதனைகளுக்கு, ஒரு சரியான முரண்பாட்டுக் கருவியைப் பயன்படுத்துங்கள்.
சதவீதக் குறிகளை மறத்தல்
CSS இல், hsl() இல் செறிவும் ஒளிர்வும் சதவீதக் குறிகளைக் கொண்டுள்ளன, சாயல் ஒரு தெளிவான எண் அல்லது deg உடன் ஓர் எண். குறிகளை விட்டுவிடுவது ஒரு பாரம்பரியத் தவறு.
ஒரு சாம்பலில் அதிகம் வாசித்தல்
ஒரு சாம்பலுக்குச் சாயல் இல்லை. மாற்றி அதற்கு 0 ஐக் காட்டினால், அது சிவப்பு கலந்தது என்று பொருளல்ல.
மாற்றுவதற்கு முன் மக்கள் கேட்கும் கேள்விகள்
HSL இல் #FF0000 என்ன?
hsl(0, 100%, 50%), தூய சிவப்பு.
HSL இல் #FFFFFF என்ன?
hsl(0, 0%, 100%), வெள்ளை. வெள்ளைக்குச் சாயல் பொருளற்றது, மாற்றி 0 ஐக் காட்டுகிறது.
HSL எங்கும் ஆதரிக்கப்படுகிறதா?
எல்லா நடப்பு உலாவிகளும் hsl() ஐயும் hsla() ஐயும் புரிந்துகொள்கின்றன. அது பல ஆண்டுகளாக CSS இல் உள்ளது.
மாற்றம் துல்லியமானதா?
அது ஒரே நிறத்தை விவரிக்கும் பொருளில் துல்லியமானது, ஆனால் எண்கள் முழுப் பாகைகளுக்கும் சதவீதங்களுக்கும் சுற்றப்படுகின்றன, எனவே திரும்பிச் செல்வது ஒரு படி தொலைவில் வந்து சேரலாம்.
என் நிறம் பதிவேற்றப்படுகிறதா?
இல்லை. கணிதம் உங்கள் உலாவிக்குள் இயங்குகிறது, எதுவும் எங்கும் அனுப்பப்படுவதில்லை.
நான் எப்படித் திரும்பிச் செல்வது?
HSL ஐ HEX ஆக மூலம்.
HEX ஐ HSL ஆக மாற்றும்போது புத்திசாலித்தனமாகத் தேர்ந்தெடுத்தல்
வேலை செய்ய HSL, சேமிக்க ஹெக்ஸ்
மூலத் தட்டைத் தெளிவற்ற தன்மை இல்லாத ஹெக்ஸில் வைத்திருந்து, மாறுபாடுகளை உருவாக்க விரும்பும்போது HSL ஐப் பயன்படுத்துங்கள். சுற்றுப் பயணங்கள் சிறிது இழக்கின்றன; மூலம் இழப்பதில்லை.
புதிய நிற இடங்களைக் கருதுங்கள்
CSS இப்போது oklch() உம் சம ஒளிர்வு உண்மையில் சமமாகத் தோன்றும் ஒத்த குறிமுறைகளும் வழங்குகிறது. புதிய வடிவமைப்பு அமைப்புகளுக்கு அவற்றைக் கற்கத் தகுதியானவை. HSL கிட்டத்தட்ட எல்லோரும் புரிந்துகொள்ளும், ஒவ்வொரு கருவியும் ஆதரிக்கும் குறிமுறையாகவே உள்ளது.
தனிப்பயன் பண்புகளைப் பயன்படுத்துங்கள்
--hue, --sat, --light ஐ வரையறுத்து, அவற்றிலிருந்து நிறங்களைக் கட்டுங்கள்: hsl(var(--hue) var(--sat) var(--light)). ஒரு கருப்பொருள் பின் சில எண்களைத் திருத்துவதன் மூலம் மாறுகிறது.
நம்பிக்கையுடன் HSL ஐ வாசித்தலும் எழுதுதலும்
நினைவில் வைக்கச் சில அடையாளங்கள்
சில எண்கள் HSL ஐ வாசிக்க எளிதாக்குகின்றன. 60 இன் மடங்குகளில் உள்ள சாயல்கள் தூய நிறங்கள்: 0 சிவப்பு, 60 மஞ்சள், 120 பச்சை, 180 சியான், 240 நீலம், 300 மெஜந்தா. 50 ஒளிர்வு 100 செறிவுடன் எந்தச் சாயலின் தூய்மையான பதிப்பைத் தருகிறது, ஒளிர்வு 95 அல்லது அதற்கு மேல் ஒரு பின்னணியாக வேலை செய்யுமளவு வெளிறிய சாயல். நீங்கள் HEX ஐ HSL ஆக மாற்றி இந்த அடையாளங்களில் ஒன்றுக்கு அருகில் ஒரு சாயலைக் கண்டால், நிறக் குடும்பத்தை ஒரே பார்வையில் பெயரிடலாம்.
குடும்பங்களுக்கிடையே நகர்தல்
ஒரு சாயலுடன் 180 ஐக் கூட்டுவது சக்கரத்தில் எதிர் நிறத்தைத் தருகிறது, அது நிரப்பி, வழக்கமாக வலுவான முரண்பாடு. 30 ஐக் கூட்டுவது அல்லது கழிப்பது அசலுக்கு அருகில் வசதியாக அமரும் ஓர் அண்டையைத் தருகிறது. வடிவமைப்பாளர்கள் ஊகிக்காமல் ஒரு வணிக நிறத்துடன் பொருந்தும் அழுத்தங்களைத் தேர்ந்தெடுக்க இந்தப் படிகளைப் பயன்படுத்துகிறார்கள்.
மாற்றிய மதிப்புகளின் ஒரு குறிப்பை வைத்திருத்தல்
நீங்கள் ஒரு தட்டுக்கு HEX ஐ HSL ஆக மாற்றும்போது, முடிவுகளை அசல் ஹெக்ஸுடன் அவற்றுக்கு அருகில் ஓர் அட்டவணையில் எழுதுங்கள். அட்டவணை நிறங்கள் எப்படித் தொடர்புடையவை என்று காட்டுகிறது, ஒரு சாயலோ ஒளிர்வோ மற்றவற்றுடன் ஒத்திசையாமல் இருந்தால், அந்த விசித்திரம் உடனே புலப்படும். அது உங்கள் குழுவுக்கு ஒரு பகிரப்பட்ட குறிப்பையும் தருகிறது.
உண்மையான திரைகளில் சோதித்தல்
அளவீடு செய்யப்பட்ட மானிட்டரில் சமநிலையாகத் தோன்றும் நிறங்கள் சூரிய ஒளியில் ஒரு தொலைபேசியிலோ மலிவான மடிக்கணினியிலோ வேறுபட்டுத் தோன்றலாம். முடிந்த தட்டை குறைந்தது இரு சாதனங்களில் சோதித்து, வெளிறிய சாயல்கள் அவற்றில் ஒன்றில் மறைந்தால் ஒளிர்வைச் சிறிது சரிசெய்யுங்கள்.
தொடர்புடைய மாற்றிகள்
கருவிகளின் அதே குடும்பம் அண்டை மாற்றங்களை உள்ளடக்குகிறது. திரும்பிச் செல்ல, HSL ஐ HEX ஆக பயன்படுத்துங்கள். குறியீட்டின் பின்னால் உள்ள எண்களுக்கு, HEX ஐ RGB ஆக உம் RGB ஐ HEX ஆக உம் உள்ளன, அச்சுக்கு, HEX ஐ CMYK ஆக உம் CMYK ஐ HEX ஆக உம். அதே நடைத் தாளில் அளவுகளுக்கு, px ஐ rem ஆக உம் px ஐ em ஆக உம் இந்தப் பக்கம் நிறங்களுக்குச் செய்வதை நீளங்களுக்குச் செய்கின்றன.
ஒரு செயல்முறை எடுத்துக்காட்டு
உங்கள் வணிக நிறம் #1E7A5C என்று வைத்துக்கொள்ளுங்கள். நீங்கள் HEX ஐ HSL ஆக மாற்றி hsl(160, 61%, 30%) ஐப் படிக்கிறீர்கள். நகர்த்தும் நிலைக்கு நீங்கள் hsl(160, 61%, 36%) என்று எழுதுகிறீர்கள், சற்று இலகுவானது. அழுத்தப்பட்ட நிலைக்கு, hsl(160, 61%, 24%). ஓர் அறிவிப்புக்குப் பின்னால் ஒரு மிக வெளிறிய பின்னணிக்கு, hsl(160, 40%, 95%). முடக்கப்பட்ட பொத்தானுக்கு, hsl(160, 12%, 60%), நிறத்தின் பெரும்பகுதி எடுக்கப்பட்ட அதே சாயல். ஐந்து நிறங்கள், ஒரு சாயல், ஒரு நிமிடத்தில் எழுதப்பட்டவை, அவை அனைத்தும் ஒன்றாகச் சேர்ந்தவை போலத் தோன்றுகின்றன. வணிக நிறம் மாறும்போது, நீங்கள் சாயல் எண்ணை ஒருமுறை மாற்றுகிறீர்கள்.
ஒரு குறுகிய சரிபார்ப்புப் பட்டியல்
மாற்றுவதற்கு முன்
நிறத்துடன் என்ன செய்ய விரும்புகிறீர்கள் என்று முடிவு செய்யுங்கள்: மாறுபடுத்துவதா, கருப்பொருளாக்குவதா அல்லது வெறுமனே வாசிப்பதா.
மாற்றும்போது
ஹெக்ஸை ஒட்டி, hsl ஐப் படித்து மூன்று எண்களைக் குறித்துக்கொள்ளுங்கள்.
மாற்றிய பின்
ஒரு நேரத்தில் ஒரு எண்ணை மாற்றி மாறுபாடுகளை உருவாக்கி, உண்மையான பின்னணியில் அவற்றைப் பாருங்கள்.
பொதுவான தவறுகள்
சுற்றப்பட்ட எண்களைத் துல்லியமானவை என்று கருதுதல்
அவை முழு எண்கள். ஹெக்ஸை மூலமாக வைத்திருங்கள்.
ஒளிர்வைப் பிரகாசத்துடன் சமப்படுத்துதல்
ஒரே ஒளிர்வில் உள்ள இரு நிறங்கள் அவை எவ்வளவு பிரகாசமாகத் தோன்றுகின்றன என்பதில் பெரிதும் வேறுபடலாம்.
சதவீதக் குறிகளை விட்டுவிடுதல்
CSS இல் செறிவுக்கும் ஒளிர்வுக்கும் அவை தேவை.
உங்கள் நிறங்கள் உங்கள் சாதனத்திலேயே இருக்கும்
கணக்கீடு உள்ளூரில் நடக்கிறது. உங்கள் மதிப்புகள் உங்கள் சொந்த உலாவியால் பயன்படுத்தப்படுகின்றன, எதுவும் எங்கும் அனுப்பப்படுவதில்லை. பின்னர் நீக்க எதுவும் இல்லை, உருவாக்க ஒரு கணக்கும் இல்லை. HEX ஐ HSL ஆக மாற்றுவதற்கான தெளிவான வழி அதுவே.
சுருக்கம்
இங்கே HEX ஐ HSL ஆக மாற்ற, ஹெக்ஸ் குறியீட்டைத் தட்டச்சு செய்யுங்கள் அல்லது ஒட்டுங்கள், hsl மதிப்பை உடனே படியுங்கள். மாற்றம் கண் வரிசைப்படுத்துவது போல நிறத்தைக் காக்கிறது: சக்கரத்தில் ஒரு சாயல், அது எவ்வளவு செறிவானது, எவ்வளவு இலகுவானது. அதனால்தான் HSL ஐ வைத்திருப்பது தகுதியானது, ஏனெனில் ஒரு எண்ணை மாற்றுவதன் மூலம் ஒரு நிறத்தை வெளிறச் செய்யலாம் அல்லது ஒரு நிழலை இருண்டதாக்கலாம், ஹெக்ஸில் அது கிட்டத்தட்ட இயலாதது. இரண்டும் ஒரே நிறங்களை விவரிக்கின்றன, ஆனால் HSL அவற்றை ஒரு வேறுபட்ட வடிவியலினூடே அடைகிறது, அதன் மூன்று எண்களும் முழுப் பாகைகளுக்கும் முழு சதவீதங்களுக்கும் சுற்றப்படுகின்றன, எனவே HSL க்கு எடுத்துச் சென்று திரும்பக் கொண்டுவரப்பட்ட ஒரு நிறம் அது தொடங்கிய இடத்திலிருந்து ஒரு அல்லது இரு படிகள் தொலைவில் வந்து சேரலாம். உங்களுக்குத் துல்லியப் பைட்டுகள் திரும்பத் தேவைப்பட்டால், ஹெக்ஸை வைத்திருங்கள். எதுவும் பதிவேற்றப்படுவதில்லை.