HSL થી RGB રૂપાંતરક

કોઈપણ HSL રંગને RGB માં રૂપાંતર કરો — તરત અને મફતમાં

#F39C12

કોઈ પણ રંગ મૂલ્ય પેસ્ટ કરો — અમે ફોર્મેટ આપમેળે ઓળખીશું.

H
S
L
RGB પરિણામ
લાલ
243
લીલો
156
નીલો
18

આ રંગ દરેક ફોર્મેટમાં

CMYK પ્રોફાઇલ: Coated FOGRA39 (યુરોપ માટે Photoshop નો ડિફોલ્ટ)

HSL રંગ પસંદ કરવાનું સરળ અને સમજવા લાયક રીત છે; RGB તે છે જે સ્ક્રીન્સ, કૅનવાસ APIs અને ઈમેજ કોડ વાસ્તવમાં ગ્રહણ કરે છે. આ કન્વર્ટર કોઈપણ hue, saturation અને lightness ત્રયને ખરા 0–255 ચેનલ્સમાં ફેરવે છે.

HSL થી RGB રૂપાંતર કેવી રીતે કામ કરે છે

  1. S અને L ને ભિન્ન દાખલા (ફ્રેક્શન્સ) માં બદલો અને ક્રોમા C = (1 − |2L − 1|) × S ની ગણના કરો.
  2. હ્યુને 60 વડે ભાગો, જેથી રંગચક્ર પર તેનો સેગમેન્ટ શોધી શકાય, અને મધ્યવર્તી મૂલ્ય X = C × (1 − |(H/60 mod 2) − 1|) ગણો.
  3. આ સેગમેન્ટ મુજબ C, X અને 0 ને R, G અને B સ્લોટ્સમાં સોંપો.
  4. બધા ત્રણ ચેનલમાં લાઇટનેસ ઓફસેટ L − C/2 ઉમેરો અને પછી 255થી ગુણાઓ.

કાર્યકર ઉદાહરણ

HSL hsl(37, 90%, 51%)=RGB rgb(243, 156, 18)

પરિણામ આખા ચેનલ્સ માટે અંતિમ રાઉન્ડિંગ સુધી ચોક્કસ હોય છે. હ્યુ અથવા સૅચ્યુરેશનના ભિન્ન મૂલ્યાંકો સપોર્ટ થાય છે અને નજીકના RGB ત્રય પર પહોંચે છે.

HSL અને RGB ની સમજ

HSL શું છે?

HSL રંગને ત્રણ ભાગમાં વહેંચે છે: હ્યૂ (રંગચક્ર પર 0–360°), સેચ્યુરેશન (રંગ કેટલો રંગીન છે, 0–100%) અને લાઇટનેસ (કેટલો તેજસ્વી છે, 0–100%). દરેક ભાગ લોકો રંગનું વર્ણન જે રીતે કરે છે તેની સાથે મેળ ખાય છે, તેથી હાથથી કે કોડમાં ટિન્ટ, શેડ અને સુસંગત પેલેટ બનાવવા માટે HSL સૌથી સરળ ફોર્મેટ છે.

સિન્ટેક્સ:
hsl(H, S%, L%)
રેણ્ઝ:
0–360°, 0–100%, 0–100%
સૌથી યોગ્ય માટે:
પેલેટ્સ, ટીન્ટ અને શેડ્સ, થીમિંગ

RGB શું છે?

RGB રંગને પ્રકાશની ત્રણ ચેનલ તરીકે વર્ણવે છે (લાલ, લીલો અને વાદળી), દરેક 0 થી 255 સુધી. તે સ્ક્રીન ખરેખર કેવી રીતે કામ કરે છે તે દર્શાવે છે: ત્રણેય 255 પર સફેદ આપે છે, બધા 0 પર કાળો. જ્યારે તમારે રંગ સાથે ગણતરી કરવાની જરૂર હોય ત્યારે RGB સાચી પસંદગી છે, અને rgba() ઉપર પારદર્શિતા ઉમેરે છે.

સિન્ટેક્સ:
rgb(R, G, B)
રેણ્ઝ:
દરેક ચેનલ માટે 0–255
સૌથી યોગ્ય માટે:
કોડ, કેનવસ, rgba() સાથે ટ્રાન્સપરન્સી

HSL થી RGB સંદર્ભ ટેબલ

સર્વાધિક સામાન્ય CSS રંગો, HSL થી RGB માં રૂપાંતરિત.

રંગHSLRGB
blackhsl(0, 0%, 0%)rgb(0, 0, 0)
whitehsl(0, 0%, 100%)rgb(255, 255, 255)
redhsl(0, 100%, 50%)rgb(255, 0, 0)
limehsl(120, 100%, 50%)rgb(0, 255, 0)
bluehsl(240, 100%, 50%)rgb(0, 0, 255)
yellowhsl(60, 100%, 50%)rgb(255, 255, 0)
orangehsl(39, 100%, 50%)rgb(255, 166, 0)
tealhsl(180, 100%, 25%)rgb(0, 127, 128)
purplehsl(300, 100%, 25%)rgb(128, 0, 127)
grayhsl(0, 0%, 50%)rgb(128, 128, 128)

બરાબર પુછાતા પ્રશ્નો

S અને L ને ભિન્ન દાખલા (ફ્રેક્શન્સ) માં બદલો અને ક્રોમા C = (1 − |2L − 1|) × S ની ગણના કરો. હ્યુને 60 વડે ભાગો, જેથી રંગચક્ર પર તેનો સેગમેન્ટ શોધી શકાય, અને મધ્યવર્તી મૂલ્ય X = C × (1 − |(H/60 mod 2) − 1|) ગણો. આ સેગમેન્ટ મુજબ C, X અને 0 ને R, G અને B સ્લોટ્સમાં સોંપો. બધા ત્રણ ચેનલમાં લાઇટનેસ ઓફસેટ L − C/2 ઉમેરો અને પછી 255થી ગુણાઓ.

પરિણામ આખા ચેનલ્સ માટે અંતિમ રાઉન્ડિંગ સુધી ચોક્કસ હોય છે. હ્યુ અથવા સૅચ્યુરેશનના ભિન્ન મૂલ્યાંકો સપોર્ટ થાય છે અને નજીકના RGB ત્રય પર પહોંચે છે.

RGB રંગને પ્રકાશની ત્રણ ચેનલ તરીકે વર્ણવે છે (લાલ, લીલો અને વાદળી), દરેક 0 થી 255 સુધી. તે સ્ક્રીન ખરેખર કેવી રીતે કામ કરે છે તે દર્શાવે છે: ત્રણેય 255 પર સફેદ આપે છે, બધા 0 પર કાળો. જ્યારે તમારે રંગ સાથે ગણતરી કરવાની જરૂર હોય ત્યારે RGB સાચી પસંદગી છે, અને rgba() ઉપર પારદર્શિતા ઉમેરે છે.

હા. ઈનપુટની બાજુનો સ્વેપ બટન તમને RGB થી HSL કન્વર્ટર પર લઈ જાય છે, જે એકદમ સમાન રીતે કામ કરે છે. બંને દિશાઓ માટે તે જ સૂત્ર વપરાય છે, ફક્ત ઉલટા રીતે લાગુ પડતું હોય છે.

કોડમાં પેલેટ જનરેટ કરી રહ્યું છે? HSL માં હ્યુ per step loop ચલાવો અને દરેક સ્ટેપને RGB માં કન્વર્ટ કરો — તમને સમાન અંતરના રંગ મળશે જે કોઈ મેન્યુઅલ RGB એડજસ્ટમેન્ટથી મળતા નથી.