RGB to HSL converter

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

#9B59B6

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

R
G
B
HSL ഫലം
ഹ്യൂ
283°
സാച്ചുറേഷൻ
39%
ലൈറ്റ്‌നസ്
53%

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

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

RGB ഒരു സ്ക്രീനിൽ എത്രക്കുറിച്ച് ലൈറ്റ് പുറപ്പെടുവിക്കണമെന്ന് പറയുന്നു; HSL നിങ്ങള്‍ക്കുയിന്ന് നിറം എങ്ങനെ കാണപ്പെടുമെന്ന് പറഞ്ഞുതരുന്നു. മൂന്നു ചാനലുകളെ hue, saturation, lightness ലേക്ക് മാറ്റിയാൽ നിറത്തെ കൈ കൊണ്ട് എളുപ്പത്തിൽ ക്രമീകരിക്കാം.

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

  1. R, G, B ഓരോന്നിനെയും 255 കൊണ്ട് ഹരിച്ച്, ഓരോ മൂല്യവും 0-നും 1-നും ഇടയിലാക്കുക.
  2. മൂന്ന് മൂല്യങ്ങളിൽ പരമാവധിയും പരമാവതിയും എടുത്ത് അവയുടെ ശരാശരി lightness L ആണ്.
  3. പരമാവധിയും പരമാവതിയും തുല്യമായിരുന്നെങ്കിൽ, നിറം ശൂന്യമാണ്: hue ഉം saturation ഉം രണ്ടും 0 ആണ്.
  4. അല്ലെങ്കില്‍ പരമാവധി-പരമാവതിയുടെ വ്യത്യാസത്തിൽ നിന്നു S നിശ്ചയിച്ച് ഏത് ചാനൽ പരമാവധി ആണെന്ന് നോക്കി H വായിക്കുക.

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

RGB rgb(155, 89, 182)=HSL hsl(283, 39%, 53%)

സിദ്ധാന്തത്തിൽ സൗഖ്യമുള്ളതാണ്. H, S, L സാധാരണയായി ഒറ്റപ്പെട്ട മുഴുവൻ നമ്പർ ആയി കാണിക്കപ്പെടുന്നതിനാൽ തിരിച്ചുവരുമ്പോൾ ഒരു ചാനൽ ഒരു അല്ലെങ്കിൽ രണ്ട് ഘട്ടങ്ങൾ മാറാം.

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

RGB എന്താണ്?

RGB ഒരു കളർ മൂന്ന് ലൈറ്റ് ചാനലുകളായി വിവരിക്കുന്നു — red, green, blue — ഓരോത് 0–255 വരെയാണ്. ഇത് സ്ക്രീനുകൾ എങ്ങനെ പ്രവർത്തിക്കുന്നു എന്നതിനെ പ്രതിഫലിപ്പിക്കുന്നു: മൂന്നു ചാനലുകളും 255 ആയാൽ വെള്ള, എല്ലാ ചാനലുകളും 0 ആണെങ്കിൽ കറുപ്പ്. കളറുമായി കണക്കുകൾ ചെയ്യേണ്ടപ്പോഴെല്ലാം RGB അനുയോജ്യമാണ്, rgba() വഴി transparency ചേർക്കാനും കഴിയും.

Syntax:
rgb(R, G, B)
Range:
ഒരു ചാനലിന് 0–255
Best for:
code, canvas, rgba() ഉപയോഗിച്ച് transparency

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

RGB to HSL reference table

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

നിറംRGBHSL
blackrgb(0, 0, 0)hsl(0, 0%, 0%)
whitergb(255, 255, 255)hsl(0, 0%, 100%)
redrgb(255, 0, 0)hsl(0, 100%, 50%)
limergb(0, 255, 0)hsl(120, 100%, 50%)
bluergb(0, 0, 255)hsl(240, 100%, 50%)
yellowrgb(255, 255, 0)hsl(60, 100%, 50%)
orangergb(255, 165, 0)hsl(39, 100%, 50%)
tealrgb(0, 128, 128)hsl(180, 100%, 25%)
purplergb(128, 0, 128)hsl(300, 100%, 25%)
grayrgb(128, 128, 128)hsl(0, 0%, 50%)

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

R, G, B ഓരോന്നിനെയും 255 കൊണ്ട് ഹരിച്ച്, ഓരോ മൂല്യവും 0-നും 1-നും ഇടയിലാക്കുക. മൂന്ന് മൂല്യങ്ങളിൽ പരമാവധിയും പരമാവതിയും എടുത്ത് അവയുടെ ശരാശരി lightness L ആണ്. പരമാവധിയും പരമാവതിയും തുല്യമായിരുന്നെങ്കിൽ, നിറം ശൂന്യമാണ്: hue ഉം saturation ഉം രണ്ടും 0 ആണ്. അല്ലെങ്കില്‍ പരമാവധി-പരമാവതിയുടെ വ്യത്യാസത്തിൽ നിന്നു S നിശ്ചയിച്ച് ഏത് ചാനൽ പരമാവധി ആണെന്ന് നോക്കി H വായിക്കുക.

സിദ്ധാന്തത്തിൽ സൗഖ്യമുള്ളതാണ്. H, S, L സാധാരണയായി ഒറ്റപ്പെട്ട മുഴുവൻ നമ്പർ ആയി കാണിക്കപ്പെടുന്നതിനാൽ തിരിച്ചുവരുമ്പോൾ ഒരു ചാനൽ ഒരു അല്ലെങ്കിൽ രണ്ട് ഘട്ടങ്ങൾ മാറാം.

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

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

നിശ്ചിത നിറമല്ല, ബന്ധമുള്ള ഒരു നിറം വേണമെങ്കിൽ HSL ഉത്തമം: complementary ആക്‌സെന്റിന് H തിരിച്ചിറക്കൂ, ശാന്തമായ വേർഷനിനായി S കുറക്കൂ, ഹോവർ സ്റ്റേറ്റിനായി L ഉയർത്തൂ.