வண்ண வடிவமைப்பு மாற்றி

வண்ண வடிவமைப்பு மாற்றி

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

வண்ண வடிவ மாற்றம் என்றால் என்ன?

ஒரு நிறம் என்பது வண்ண வெளியில் ஒரு புள்ளி மட்டுமே. HEX மற்றும் RGB அந்த புள்ளியை சிவப்பு, பச்சை, நீலம் ஆகிய ஒளியின் தீவிரங்களால் விவரிக்கின்றன - திரைகள் நிறத்தை உருவாக்கும் விதம் இதுவே. HSL அதே புள்ளியை ஹியூ (வண்ண சக்கரத்தில் உள்ள இடம்), சாச்சுரேஷன் (எவ்வளவு தெளிவானது) மற்றும் லைட்னெஸ் (கருப்பு அல்லது வெள்ளைக்கு எவ்வளவு அருகில்) மூலம் விவரிக்கிறது. CMYK, காகிதத்தில் அந்த நிறத்தை மறுஉருவாக்கம் செய்ய அச்சுப்பொறிக்கு எவ்வளவு சயான், மெஜந்தா, மஞ்சள் மற்றும் கருப்பு மை தேவை என்பதை விவரிக்கிறது. இந்த நான்கும் ஒரே அடிப்படை நிறத்திற்கான வெவ்வேறு ஒருங்கிணைப்பு அமைப்புகள் மட்டுமே.

சூத்திரங்கள்

HEX to RGB: 6-இலக்க ஹெக்ஸ் கோடை மூன்று 2-இலக்க ஜோடிகளாகப் பிரித்து, ஒவ்வொன்றையும் 0-255 வரையிலான base-16 எண்ணாகப் படிக்கிறது:

$$R = \text{hex}_{1:2}, \quad G = \text{hex}_{3:4}, \quad B = \text{hex}_{5:6}$$

RGB to HSL: முதலில் சிவப்பு, பச்சை, நீலத்தை 0-1 வரம்பிற்கு இயல்பாக்கி, பின்னர் மிக உயர்ந்த மற்றும் மிகக் குறைந்த சேனலின் நடுப்புள்ளியிலிருந்து லைட்னெஸைப் பெறுகிறது:

$$L = \frac{max(R,G,B) + min(R,G,B)}{2}$$ $$S = \frac{max(R,G,B) - min(R,G,B)}{1 - |2L - 1|}$$

RGB to CMYK: மிகவும் பிரகாசமான சேனலிலிருந்து முதலில் கருப்பு (K) கண்டறியப்படுகிறது, பின்னர் மீதமுள்ள பிரகாசத்திற்கு ஒப்பீட்டளவில் சயான், மெஜந்தா, மஞ்சள் பெறப்படுகிறது:

$$K = 1 - max(R,G,B)$$ $$C = \frac{1 - R - K}{1 - K}, \quad M = \frac{1 - G - K}{1 - K}, \quad Y = \frac{1 - B - K}{1 - K}$$

சார்பியல் ஒளிர்வு (luminance) - வாசிக்கக்கூடிய உரை நிறத்தைத் தேர்ந்தெடுக்க பயன்படுகிறது - sRGB மதிப்புகளை நேர்கோட்டாக்கிய பிறகு, ஒவ்வொரு சேனலையும் மனித கண்ணின் உணர்திறனுக்கு ஏற்ப எடையிடுகிறது:

$$L_{rel} = 0.2126 R_{lin} + 0.7152 G_{lin} + 0.0722 B_{lin}$$

இந்த கருவி கருப்பு மற்றும் வெள்ளை உரையின் மாறுபாட்டு விகிதத்தை உங்கள் நிறத்தின் ஒளிர்வுடன் ஒப்பிட்டு, WCAG AA வரம்பான 4.5:1ஐ அதிக வித்தியாசத்துடன் தாண்டுவதை பரிந்துரைக்கிறது.

நிரப்பு நிறம் வண்ண சக்கரத்தில் ஹியூவை சரியாக 180 டிகிரி சுழற்றி, சாச்சுரேஷன் மற்றும் லைட்னெஸை அப்படியே வைத்து, மீண்டும் HEXக்கு மாற்றுகிறது.

இந்த கருவியை எப்படி பயன்படுத்துவது

1. வண்ண மாதிரியைக் கிளிக் செய்து எந்த நிறத்தையும் தேர்ந்தெடுக்கவும், அல்லது HEX கோடை நேரடியாக தட்டச்சு செய்யவும்.
2. அதே நிறத்தை HEX, RGB, HSL, CMYK என உடனடியாகக் காணவும்.
3. நிரப்பு நிறத்தைப் பார்க்கவும் - ஆக்சென்ட் நிறங்கள் அல்லது இரு-டோன் வடிவமைப்புகளுக்கு பயனுள்ளது.
4. உங்கள் நிறத்தின் மேல் கருப்பு அல்லது வெள்ளை உரை சிறப்பாக தெரிகிறதா என்பதையும், அது "வெப்-சேஃப்" நிறமா என்பதையும் சரிபார்க்கவும்.

உதாரணம்

நீலநிறம் #3B82F6ஐ எடுத்துக்கொள்வோம்:

• RGB: R=59, G=130, B=246 → rgb(59, 130, 246)
• HSL: ஹியூ ≈ 217°, சாச்சுரேஷன் ≈ 91%, லைட்னெஸ் ≈ 60% → hsl(217, 91%, 60%)
• CMYK: K = 1 - 246/255 ≈ 4%; C ≈ 76%, M ≈ 47%, Y ≈ 0% → cmyk(76%, 47%, 0%, 4%)
• நிரப்பு நிறம்: ஹியூ 217° + 180° = 37° → ஒரு சூடான ஆரஞ்சு, #F6AF3C
• சார்பியல் ஒளிர்வு ≈ 0.235, இது 0.5 நடுப்புள்ளியை விட குறைவு, எனவே இந்த நீலநிறம் "இருண்டது" எனக் கருதப்படுகிறது. கருப்பு உரையுடனான மாறுபாடு (≈ 5.71:1) வெள்ளை உரையுடனான மாறுபாட்டை (≈ 3.68:1) விட சிறந்தது, எனவே கருப்பு உரை பரிந்துரைக்கப்பட்ட மேலடுக்கு நிறமாகும்.