ImageColorPicker.com

HSL to HEX converter

ഏതെങ്കിലും HSL നിറം HEX ആയി മാറ്റുക — തൽക്ഷണം, സൗജന്യമായി

#3398DB

ഏതെങ്കിലും നിറ മൂല്യം പേസ്റ്റ് ചെയ്യുക — ഞങ്ങൾ ഫോർമാറ്റ് നിങ്ങക്കുവേണ്ടി കണ്ടെത്തും.

H
S
L
HEX ഫലം

ഈ നിറം എല്ലാ ഫോർമാറ്റുകളിലും

CMYK പ്രൊഫൈൽ: Coated FOGRA39 (യൂറോപ്പിലെ Photoshop-ന്റെ ഡിഫോൾട്ട്)

HSL-ൽ നിറം തിരഞ്ഞെടുക്കുന്നത് സൗകര്യപ്രദമാണ്, പക്ഷേ സ്റ്റൈൽഷീറ്റുകളും ഡിസൈൻ കൈമാറ്റങ്ങളും ബ്രാൻഡ് ഡോക്യുമെന്റുകളും ഇപ്പോഴും HEX-ൽ തന്നെയാണ് പ്രവർത്തിക്കുന്നത്. ഈ കൺവെർട്ടർ ആ വിടവ് നികത്തുന്നു, ഏത് ഹ്യൂ, സാച്ചുറേഷൻ, ലൈറ്റ്നെസ് സംയോജനത്തിനും ആറക്ക കോഡ് നൽകുന്നു.

HSL നിന്ന് HEX വരെ മാറ്റം എങ്ങനെ നടക്കുന്നു

  1. Saturation ഉം lightness ഉം ഭാഗങ്ങളാക്കി മാറ്റുക: 60% → 0.6.
  2. ക്രോമ C = (1 − |2L − 1|) × S കണക്കാക്കുക. നിറം ചാരനിറത്തിൽ നിന്ന് എത്ര അകലെയാണെന്ന് ഇത് കാണിക്കുന്നു.
  3. ആ chroma ചുവപ്പ്, പച്ച, നീല ചാനലുകളിൽ ഹ്യൂ ഉപയോഗിച്ച് സ്ഥാനം നിശ്ചയിക്കുക, പിന്നെ മൂവതെയും L − C/2 കൊണ്ട് ഷിഫ്റ്റ് ചെയ്യുക.
  4. ഓരോ ചാനലും 255-ൽ ഗുണിച്ച്, വലിപ്പിച്ച്, രണ്ടടി ഹെക്സാഡെസിമൽ അക്കങ്ങളായി എഴുതുക.

പ്രായോഗിക ഉദാഹരണം

HSL hsl(204, 70%, 53%)=HEX #3398DB

റൗണ്ടിംഗ് ഒരു തവണ മാത്രം, അവസാന ഘട്ടത്തിലാണ് നടക്കുന്നത്. ഓരോ ചാനലും 0–255 എന്ന പൂർണ്ണസംഖ്യാ മൂല്യത്തിലേക്ക് ക്രമീകരിക്കപ്പെടുമ്പോഴാണിത്. ഫലം നിങ്ങളുടെ HSL ഇൻപുട്ടിനോട് ഏറ്റവും അടുത്തുള്ള HEX കോഡാണ്, സാധാരണയായി ഒരു ഡിസൈൻ ടൂൾ കാണിക്കുന്നതിന് സമാനവുമായിരിക്കും.

HSLയും HEXയും വിശദീകരിച്ചത്

HSL എന്താണ്?

HSL ഒരു നിറത്തെ hue (വർണ്ണചക്രത്തിലെ 0–360°), saturation (എത്ര നിറമുള്ളത്, 0–100%), lightness (എത്ര തെളിച്ചമുള്ളത്, 0–100%) എന്നിങ്ങനെ മൂന്ന് ഭാഗങ്ങളായി വിഭജിക്കുന്നു. ഓരോ ഭാഗവും ആളുകൾ നിറത്തെ വിവരിക്കുന്ന രീതിയോട് യോജിക്കുന്നതിനാൽ, ടിന്റുകൾ, ഷേഡുകൾ, സ്ഥിരതയുള്ള പാലറ്റുകൾ എന്നിവ കൈകൊണ്ടോ കോഡിലോ നിർമ്മിക്കാൻ HSL ആണ് ഏറ്റവും എളുപ്പമുള്ള ഫോർമാറ്റ്.

Syntax:
hsl(H, S%, L%)
Range:
0–360°, 0–100%, 0–100%
Best for:
palettes, tints and shades, theming

HEX എന്താണ്?

മുന്നിൽ # ചിഹ്നമുള്ള ആറക്ക ഹെക്സാഡെസിമൽ സംഖ്യയാണ് HEX കോഡ്. ഇത് ഒരു നിറത്തിന്റെ റെഡ്, ഗ്രീൻ, ബ്ലൂ ചാനലുകൾ സംഭരിക്കുന്നു. ഓരോ ജോഡി അക്കങ്ങളും ഒരു ചാനലിനെ പ്രതിനിധീകരിക്കുന്നു, 00 (ഒന്നുമില്ല) മുതൽ FF (പൂർണ്ണം) വരെ. RGB-യുടെ അതേ 16.7 ദശലക്ഷം നിറങ്ങൾ ഇത് കൂടുതൽ ചെറിയ രൂപത്തിൽ നൽകുന്നു. CSS, ഡിസൈൻ ടൂളുകൾ, ബ്രാൻഡ് ഗൈഡ്‌ലൈനുകൾ എന്നിവയിൽ HEX ആണ് സ്ഥിരസ്ഥിതി.

Syntax:
#RRGGBB
Range:
ഒരു ചാനലിന് 00–FF
Best for:
CSS, design handoff, brand guidelines

HSL to HEX reference table

സാധാരണയായി ഉപയോഗിക്കുന്ന CSS നിറങ്ങൾ HSL ൽ നിന്ന് HEX ആയി പരിവർത്തനം ചെയ്തിരിക്കുന്നു.

നിറംHSLHEX
blackhsl(0, 0%, 0%)#000000
whitehsl(0, 0%, 100%)#FFFFFF
redhsl(0, 100%, 50%)#FF0000
limehsl(120, 100%, 50%)#00FF00
bluehsl(240, 100%, 50%)#0000FF
yellowhsl(60, 100%, 50%)#FFFF00
orangehsl(39, 100%, 50%)#FFA600
tealhsl(180, 100%, 25%)#007F80
purplehsl(300, 100%, 25%)#80007F
grayhsl(0, 0%, 50%)#808080

കൂടുതൽ നിറ പരിവർത്തകരുകൾ

HEX മുതൽ RGB വരെRGB മുതൽ HEX വരെHEX മുതൽ HSL വരെHEX മുതൽ CMYK വരെCMYK മുതൽ HEX വരെRGB മുതൽ HSL വരെHSL മുതൽ RGB വരെRGB മുതൽ CMYK വരെCMYK മുതൽ RGB വരെHSL മുതൽ CMYK വരെCMYK മുതൽ HSL വരെ

ഈ നിറവുമായി തുടരുക

നിരന്തരം ചോദിക്കപ്പെടുന്ന ചോദ്യങ്ങൾ

Saturation ഉം lightness ഉം ഭാഗങ്ങളാക്കി മാറ്റുക: 60% → 0.6. ക്രോമ C = (1 − |2L − 1|) × S കണക്കാക്കുക. നിറം ചാരനിറത്തിൽ നിന്ന് എത്ര അകലെയാണെന്ന് ഇത് കാണിക്കുന്നു. ആ chroma ചുവപ്പ്, പച്ച, നീല ചാനലുകളിൽ ഹ്യൂ ഉപയോഗിച്ച് സ്ഥാനം നിശ്ചയിക്കുക, പിന്നെ മൂവതെയും L − C/2 കൊണ്ട് ഷിഫ്റ്റ് ചെയ്യുക. ഓരോ ചാനലും 255-ൽ ഗുണിച്ച്, വലിപ്പിച്ച്, രണ്ടടി ഹെക്സാഡെസിമൽ അക്കങ്ങളായി എഴുതുക.

റൗണ്ടിംഗ് ഒരു തവണ മാത്രം, അവസാന ഘട്ടത്തിലാണ് നടക്കുന്നത്. ഓരോ ചാനലും 0–255 എന്ന പൂർണ്ണസംഖ്യാ മൂല്യത്തിലേക്ക് ക്രമീകരിക്കപ്പെടുമ്പോഴാണിത്. ഫലം നിങ്ങളുടെ HSL ഇൻപുട്ടിനോട് ഏറ്റവും അടുത്തുള്ള HEX കോഡാണ്, സാധാരണയായി ഒരു ഡിസൈൻ ടൂൾ കാണിക്കുന്നതിന് സമാനവുമായിരിക്കും.

മുന്നിൽ # ചിഹ്നമുള്ള ആറക്ക ഹെക്സാഡെസിമൽ സംഖ്യയാണ് HEX കോഡ്. ഇത് ഒരു നിറത്തിന്റെ റെഡ്, ഗ്രീൻ, ബ്ലൂ ചാനലുകൾ സംഭരിക്കുന്നു. ഓരോ ജോഡി അക്കങ്ങളും ഒരു ചാനലിനെ പ്രതിനിധീകരിക്കുന്നു, 00 (ഒന്നുമില്ല) മുതൽ FF (പൂർണ്ണം) വരെ. RGB-യുടെ അതേ 16.7 ദശലക്ഷം നിറങ്ങൾ ഇത് കൂടുതൽ ചെറിയ രൂപത്തിൽ നൽകുന്നു. CSS, ഡിസൈൻ ടൂളുകൾ, ബ്രാൻഡ് ഗൈഡ്‌ലൈനുകൾ എന്നിവയിൽ HEX ആണ് സ്ഥിരസ്ഥിതി.

അതെ. ഇൻപുട്ടിന്റെ അടുത്തുള്ള സ്വപ് ബട്ടൺ നിന്നെ HEX to HSL കൺവർത്തറിലേക്ക് തിരയിക്കും, അത് ശരിയായി അതേ രീതിയിൽ പ്രവർത്തിക്കുന്നു. രണ്ട് ദിശകളും ഒരേ ഫോർമുല ഉപയോഗിക്കുന്നു, വെറും റിവേഴ്സ് ആയി പ്രയോഗിച്ചാൽ മതിയാകും.

Palette HSL-ൽ നിർമ്മിച്ചുക, പിന്നെ HEX olarak export ചെയ്യുക. പാൽറ്റെയിൻ ലജിക് — ഒരേ ഹ്യൂ, സ്റ്റെപ്പായ ലൈറ്റ്‌നെസ്സ് — മനസ്സിലായിരിക്കും, ഡെൽിവർ ചെയ്യപ്പെടുന്ന കോഡ് ഡെവലപ്പർമാർ പ്രതീക്ഷിക്കുന്ന ഫോർമാറ്റിലായിരിക്കും.