ചിത്രങ്ങളിൽ നിന്ന് കൃത്യമായ നിറങ്ങൾ കണ്ടെത്തുക
ഡിജിറ്റൽ ഡിസൈനുകളിലും വെബ് ഡെവലപ്മെന്റിലും കൃത്യമായ നിറങ്ങൾ ഉപയോഗിക്കുന്നത് വളരെ പ്രധാനമാണ്. ചിത്രങ്ങളിൽ നിന്ന് നമുക്ക് ആവശ്യമുള്ള കൃത്യമായ നിറം കണ്ടെത്താൻ സഹായിക്കുന്ന ഒരു ബ്രൗസർ അധിഷ്ഠിത ടൂളാണ് ഇമേജ് കളർ പിക്കർ. നിങ്ങളുടെ കമ്പ്യൂട്ടറിലോ ഫോണിലോ ഉള്ള ഒരു ചിത്രം അപ്ലോഡ് ചെയ്ത്, അതിലെ ഓരോ പിക്സലിലെയും നിറങ്ങൾ പരിശോധിച്ച് അവയുടെ കൃത്യമായ മൂല്യങ്ങൾ കണ്ടെത്താൻ ഇത് സഹായിക്കുന്നു.
ഈ ടൂൾ ഉപയോഗിച്ച് ചിത്രത്തിലെ ഏതെങ്കിലും ഒരു ഭാഗത്ത് ക്ലിക്ക് ചെയ്യുമ്പോൾ ആ പിക്സലിന്റെ HEX, RGB, HSL മൂല്യങ്ങൾ ലഭ്യമാകും. ഡിസൈനർമാർക്കും ഡെവലപ്പർമാർക്കും തങ്ങളുടെ പ്രോജക്റ്റുകളിലേക്ക് ആവശ്യമായ കളർ കോഡുകൾ വളരെ വേഗത്തിൽ പകർത്തിയെടുക്കാൻ ഇത് സഹായകരമാണ്.
പിന്തുണയ്ക്കുന്ന ഫയൽ ഫോർമാറ്റുകൾ
ഈ ടൂളിൽ വിവിധ തരത്തിലുള്ള ഇമേജ് ഫയലുകൾ ഉപയോഗിക്കാൻ സാധിക്കും. താഴെ പറയുന്ന ഫയൽ ഫോർമാറ്റുകളും അവയുടെ MIME ടൈപ്പുകളും ഈ ടൂൾ പിന്തുണയ്ക്കുന്നു:
- PNG (
image/png) - JPG / JPEG (
image/jpeg) - WebP (
image/webp) - GIF (
image/gif) - AVIF (
image/avif) - HEIC / HEIF (
image/heic,image/heif)
ഒരു ചിത്രം ലോഡ് ചെയ്യുമ്പോൾ അതിന്റെ ഏറ്റവും വലിയ വശം 4096 പിക്സലിൽ കൂടുതലാണെങ്കിൽ, സിസ്റ്റം ആ ചിത്രത്തിന്റെ വലുപ്പം സ്വയമേവ കുറയ്ക്കുന്നു. പിന്തുണയ്ക്കാത്ത ഏതെങ്കിലും ഫയൽ ഫോർമാറ്റ് ഉപയോഗിക്കാൻ ശ്രമിച്ചാൽ "ഈ ഫയൽ തരം പിന്തുണയ്ക്കുന്നില്ല. PNG, JPG, WebP, GIF, AVIF അല്ലെങ്കിൽ HEIC ചിത്രം ശ്രമിക്കുക." എന്ന മുന്നറിയിപ്പ് കാണാം. ചിത്രം കേടായതോ തുറക്കാൻ കഴിയാത്തതോ ആണെങ്കിൽ "ആ ചിത്രം തുറക്കാൻ കഴിഞ്ഞില്ല. അത് കേടായതോ പിന്തുണയ്ക്കാത്ത ഫോർമാറ്റിലുള്ളതോ ആകാം." എന്ന സന്ദേശം ലഭിക്കും.
കളർ പിക്കർ പ്രവർത്തിക്കുന്ന രീതി
ചിത്രം ടൂളിലേക്ക് ലോഡ് ചെയ്തുകഴിഞ്ഞാൽ താഴെ പറയുന്ന രീതിയിലാണ് ഇത് പ്രവർത്തിക്കുന്നത്:
- പ്രാരംഭ ഘട്ടം: ചിത്രം ലോഡ് ചെയ്യുമ്പോൾ തന്നെ ചിത്രത്തിന്റെ മധ്യഭാഗത്തുള്ള പിക്സലിന്റെ കളർ കോഡും അതിന്റെ കോർഡിനേറ്റുകളും സ്ക്രീനിൽ കാണിക്കുന്നു.
- നിറം പരിശോധിക്കൽ: ചിത്രത്തിന് മുകളിലൂടെ പോയിന്റർ നീക്കുമ്പോൾ ഓരോ പിക്സലിലെയും നിറങ്ങൾ തത്സമയം പരിശോധിക്കാൻ സാധിക്കും. ഈ സമയത്ത് "ചിത്രം തയ്യാറാണ് — നിറം പരിശോധിക്കാൻ അതിനുമുകളിലൂടെ നീങ്ങുക, സേവ് ചെയ്യാൻ ക്ലിക്ക് ചെയ്യുക." എന്ന സന്ദേശം കാണാം.
- നിറം സേവ് ചെയ്യൽ: ചിത്രത്തിൽ ക്ലിക്ക് ചെയ്യുമ്പോൾ ആ നിറം നിങ്ങളുടെ ലിസ്റ്റിലേക്ക് സേവ് ചെയ്യപ്പെടും. ഈ സമയത്ത് "
{hex}നിങ്ങളുടെ ലിസ്റ്റിലേക്ക് സേവ് ചെയ്തു." എന്ന സന്ദേശം കാണിക്കുന്നു. - കീബോർഡ് ഉപയോഗിച്ചുള്ള നിയന്ത്രണം: മൗസിന് പകരം കീബോർഡിലെ ആരോ കീകൾ (Arrow Keys) ഉപയോഗിച്ച് ചിത്രത്തിന് മുകളിലുള്ള ക്രോസ്ഹെയർ നീക്കാനും നിറങ്ങൾ പരിശോധിക്കാനും സാധിക്കും.
- വേഗതയേറിയ നീക്കം: ആരോ കീ അമർത്തിപ്പിടിക്കുന്നതിനൊപ്പം Shift കീ കൂടി അമർത്തിയാൽ ക്രോസ്ഹെയർ 10 പിക്സൽ വീതം വേഗത്തിൽ നീങ്ങുന്നു.
- കീബോർഡ് വഴി സേവ് ചെയ്യൽ: കീബോർഡ് ഉപയോഗിക്കുമ്പോൾ Enter അല്ലെങ്കിൽ Space കീ അമർത്തി നിലവിൽ തിരഞ്ഞെടുത്ത നിറം സേവ് ചെയ്യാം.
സേവ് ചെയ്യുന്ന നിറങ്ങൾ സൂക്ഷിക്കുന്ന ഹിസ്റ്ററിയിൽ പരമാവധി 12 ഇനങ്ങൾ വരെ സൂക്ഷിക്കാൻ സാധിക്കും. ഒരേ RGB മൂല്യമുള്ളതും എന്നാൽ വ്യത്യസ്ത ആൽഫ (സുതാര്യത) മൂല്യമുള്ളതുമായ നിറങ്ങൾ ഹിസ്റ്ററിയിൽ വെവ്വേറെയായി തന്നെ സേവ് ചെയ്യപ്പെടും. "വീണ്ടും തുടങ്ങുക" എന്ന ബട്ടൺ അമർത്തുന്നതിലൂടെ ലോഡ് ചെയ്ത ചിത്രവും സേവ് ചെയ്ത കളർ ഹിസ്റ്ററിയും പൂർണ്ണമായി ഒഴിവാക്കി ടൂൾ ആദ്യത്തെ അവസ്ഥയിലേക്ക് റീസെറ്റ് ചെയ്യാം.
കളർ മോഡലുകളും ഔട്ട്പുട്ടുകളും
തിരഞ്ഞെടുക്കുന്ന ഓരോ പിക്സലിന്റെയും മൂന്ന് പ്രധാന കളർ ഫോർമാറ്റുകൾ ഈ ടൂൾ കാണിച്ചുതരുന്നു:
- HEX: വെബ് ഡിസൈനുകളിൽ സാധാരണയായി ഉപയോഗിക്കുന്ന ഹെക്സാഡെസിമൽ കളർ കോഡ്.
- RGB: റെഡ്, ഗ്രീൻ, ബ്ലൂ എന്നീ പ്രാഥമിക നിറങ്ങളുടെ അളവ് വ്യക്തമാക്കുന്ന ഫോർമാറ്റ്.
- HSL: ഹ്യൂ (Hue), സാച്ചുറേഷൻ (Saturation), ലൈറ്റ്നസ് (Lightness) എന്നിവ അടിസ്ഥാനമാക്കിയുള്ള ഫോർമാറ്റ്.
ഈ കളർ കോഡുകളിൽ ക്ലിക്ക് ചെയ്യുന്നതിലൂടെ അവ നിങ്ങളുടെ ക്ലിപ്പ്ബോർഡിലേക്ക് കോപ്പി ചെയ്യാം. ബ്രൗസർ സുരക്ഷാ കാരണങ്ങളാൽ ക്ലിപ്പ്ബോർഡ് ആക്സസ് തടയുകയാണെങ്കിൽ "കോപ്പി ചെയ്യാൻ കഴിഞ്ഞില്ല — നിങ്ങളുടെ ബ്രൗസർ ക്ലിപ്പ്ബോർഡ് ആക്സസ് തടഞ്ഞിരിക്കുന്നു." എന്ന സന്ദേശം കാണിക്കും.
ചിത്രത്തിലെ ഒരു പിക്സൽ ഭാഗികമായി സുതാര്യമാണെങ്കിൽ (Semi-transparent), അതിന്റെ സുതാര്യതയുടെ അളവ് "ആൽഫ {n}% — ഈ പിക്സൽ ഭാഗികമായി സുതാര്യമാണ്." എന്ന രീതിയിൽ കാണിക്കുന്നു. ഇത്തരം പിക്സലുകളുടെ നിറം റീഡ് ചെയ്യുമ്പോൾ അതിന്റെ പശ്ചാത്തലത്തിലുള്ള നിറങ്ങൾ കണക്കിലെടുക്കാതെ, ആ പിക്സലിന്റെ യഥാർത്ഥ നിറം മാത്രമാണ് ടൂൾ രേഖപ്പെടുത്തുന്നത്.
കൃത്യതയെ ബാധിക്കുന്ന ഘടകങ്ങൾ
ചിത്രങ്ങളിൽ നിന്ന് നിറങ്ങൾ തിരഞ്ഞെടുക്കുമ്പോൾ ചില കാര്യങ്ങൾ ശ്രദ്ധിക്കേണ്ടതുണ്ട്. ഈ ടൂൾ ചിത്രത്തിലുള്ള യഥാർത്ഥ പിക്സൽ മൂല്യം തന്നെയാണ് കാണിക്കുന്നത്. എങ്കിലും താഴെ പറയുന്ന കാരണങ്ങളാൽ നിറങ്ങളിൽ വ്യത്യാസം അനുഭവപ്പെടാം:
- കംപ്രഷൻ (Compression): JPEG ഫോർമാറ്റിലുള്ള ചിത്രങ്ങൾ കംപ്രസ് ചെയ്യപ്പെടുമ്പോൾ പിക്സലുകളുടെ യഥാർത്ഥ നിറങ്ങളിൽ നേരിയ മാറ്റങ്ങൾ വരാം.
- ആന്റി-അലിയാസിങ് (Anti-aliasing): ചിത്രങ്ങളുടെ അരികുകൾ മിനുസപ്പെടുത്താൻ ഉപയോഗിക്കുന്ന സാങ്കേതികവിദ്യ കാരണം പിക്സൽ നിറങ്ങളിൽ വ്യത്യാസം വരാൻ സാധ്യതയുണ്ട്.
- സ്ക്രീൻഷോട്ടുകൾ: സ്ക്രീൻഷോട്ടുകൾ എടുക്കുമ്പോൾ ഒറിജിനൽ ഡിസൈനിലെ നിറങ്ങളിൽ നിന്ന് നേരിയ വ്യത്യാസം വരാം.
കൃത്യമായ പിക്സൽ തിരഞ്ഞെടുക്കാൻ സഹായിക്കുന്നതിനായി ഈ ടൂളിൽ ഒരു മാഗ്നിഫയർ (Magnifier) ഉൾപ്പെടുത്തിയിട്ടുണ്ട്. ഇത് പോയിന്ററിന് ചുറ്റുമുള്ള പിക്സലുകളെ വലുതാക്കി കാണിക്കുന്നതിനാൽ ഏറ്റവും കൃത്യതയോടെ നിറങ്ങൾ തിരഞ്ഞെടുക്കാൻ സാധിക്കുന്നു.
സ്വകാര്യതയും ഡാറ്റാ പ്രോസസ്സിംഗും
ഈ ടൂൾ ഉപയോഗിക്കുമ്പോൾ നിങ്ങളുടെ സ്വകാര്യത പൂർണ്ണമായും സംരക്ഷിക്കപ്പെടുന്നു. നിങ്ങൾ തിരഞ്ഞെടുക്കുന്ന ചിത്രം നിങ്ങളുടെ ഉപകരണത്തിൽ നിന്ന് നേരിട്ട് റീഡ് ചെയ്യുന്നതാണ്, അത് ബ്രൗസറിന് പുറത്തേക്ക് പോകുന്നില്ല. BroBroGo-ലേക്ക് ചിത്രങ്ങളോ മറ്റ് വിവരങ്ങളോ ഒന്നും തന്നെ അപ്ലോഡ് ചെയ്യുന്നില്ല.
പതിവായി ചോദിക്കുന്ന ചോദ്യങ്ങൾ (FAQ)
ചിത്രത്തിൽ നിന്ന് ഞാൻ എങ്ങനെയാണ് ഒരു നിറം തിരഞ്ഞെടുക്കുക?
ചിത്രത്തിന് മുകളിലൂടെ പോയിന്റർ നീക്കുമ്പോൾ പാനലിൽ അതിനടിയിലുള്ള നിറം കാണാം. കൃത്യമായ പിക്സൽ തിരഞ്ഞെടുക്കാൻ സഹായിക്കുന്ന ഒരു മാഗ്നിഫയർ സൂം ഇതിലുണ്ട്. ആ നിറം സേവ് ചെയ്യാൻ ക്ലിക്ക് ചെയ്യുക. ചിത്രത്തിൽ ഫോക്കസ് ചെയ്ത ശേഷം ആരോ കീകൾ ഉപയോഗിച്ച് ക്രോസ്ഹെയർ നീക്കി Enter അമർത്തുകയും ചെയ്യാം.
എനിക്ക് ഏതൊക്കെ കളർ ഫോർമാറ്റുകൾ ലഭിക്കും?
നിങ്ങൾ തിരഞ്ഞെടുക്കുന്ന ഓരോ പിക്സലും ഒരേ സമയം HEX, RGB, HSL ഫോർമാറ്റുകളിൽ കാണിക്കും. CSS അല്ലെങ്കിൽ ഡിസൈൻ ടൂളുകളിൽ പേസ്റ്റ് ചെയ്യുന്നതിനായി ഏത് മൂല്യത്തിലും ക്ലിക്ക് ചെയ്ത് കോപ്പി ചെയ്യാം.
തിരഞ്ഞെടുത്ത നിറം ഞാൻ പ്രതീക്ഷിച്ചതുമായി എപ്പോഴും പൊരുത്തപ്പെടാത്തത് എന്തുകൊണ്ടാണ്?
ചിത്രത്തിൽ സൂക്ഷിച്ചിരിക്കുന്ന കൃത്യമായ പിക്സൽ മൂല്യം നിങ്ങൾക്ക് ലഭിക്കും. ഇതൊരു JPEG അല്ലെങ്കിൽ സ്ക്രീൻഷോട്ട് ആണെങ്കിൽ, കംപ്രഷൻ കാരണം അടുത്തുള്ള പിക്സലുകളിൽ ചെറിയ വ്യത്യാസങ്ങൾ വന്നിട്ടുണ്ടാകാം. കൂടാതെ, ഭാഗികമായി സുതാര്യമായ പിക്സലുകൾ അതിന്റെ പിന്നിലുള്ള പശ്ചാത്തലം ഒഴിവാക്കിയാണ് റീഡ് ചെയ്യുന്നത്.
എന്റെ ചിത്രങ്ങൾ ഏതെങ്കിലും സെർവറിലേക്ക് അപ്ലോഡ് ചെയ്യപ്പെടുന്നുണ്ടോ?
ഇല്ല. ചിത്രം നിങ്ങളുടെ ഉപകരണത്തിൽ നിന്ന് നേരിട്ട് റീഡ് ചെയ്യുന്നതാണ്, അത് ബ്രൗസറിന് പുറത്തേക്ക് പോകുന്നില്ല. BroBroGo-ലേക്ക് ഒന്നും അപ്ലോഡ് ചെയ്യുന്നില്ല.