ImageColorPicker.com

HSL କୁ HEX ପରିବର୍ତ୍ତକ

ଆଉ କିଛି HSL ରଙ୍ଗକୁ HEX କୁ ପରିବର୍ତ୍ତନ କର — ତୁରନ୍ତ ଓ ମୁକ୍ତ

#3398DB

କୌଣସି ରଙ୍ଗ ମୂଲ୍ୟ ଅଟକାଇ ପେସ୍ଟ କର — ଆମେ ସ୍ୱୟଂ ତୁମ ପାଇଁ ଫର୍ମାଟ ଚିହ୍ନଟ କରିବୁ।

H
S
L
HEX ଫଳାଫଳ

ଏହି ରଙ୍ଗ ସମସ୍ତ ଫର୍ମାଟରେ

CMYK ପ୍ରୋଫାଇଲ୍: Coated FOGRA39 (ୟୁରୋପ ପାଇଁ Photoshopର ଡିଫଲ୍ଟ)

HSL ରେ ରଙ୍ଗ ଚୟନ କରିବା ସୁବିଧାଜନକ, କିନ୍ତୁ stylesheets, design handoffs ଏବଂ brand documents ତଥାବିଦି HEX ରେ ଚାଲିଥାଏ। ଏହି କନଭର୍ଟର୍ ସେଇ ଖାଲିକୁ ପୁରଣ କରେ ଏବଂ ଯେକୌଣସି hue, saturation ଓ lightness ଦ୍ୱାରା ଛଅ-ଡିଜିଟ୍ HEX କୋଡ୍ ଦିଏ।

HSL କୁ HEX ପରିବର୍ତ୍ତନ କିପରି କାମ କରେ

  1. saturation ଓ lightness କୁ ଭାଗ ଭଳେ ପରିବର୍ତ୍ତନ କର: 60% ହେବ 0.6।
  2. chroma C = (1 − |2L − 1|) × S ଗଣନା କର — ଏହା ଦର୍ଶାଏ ରଙ୍ଗ କେତେ ଧରଣର ଗ୍ରେ (grey) ଠାରୁ ଦୂରରେ ଅଛି।
  3. hue ବ୍ୟବହାର କରି ସେଇ chroma କୁ ଲାଲ୍, ହରିତ ଓ ନୀଳ ଚ୍ୟାନେଲରେ ରଖ, ତାପରେ ସବୁ ତିନୋଟି କୁ L − C/2 ଦ୍ୱାରା ସ୍ଥାନାନ୍ତର କର।
  4. ପ୍ରତ୍ୟେକ ଚ୍ୟାନେଲକୁ 255 ରେ ଗୁଣ କର, ଘନା କର (round), ଏବଂ ତାହାକୁ ଦୁଇ ହେକ୍ସାଡେସିମାଲ୍ ଡିଜିଟ୍ ଭାବେ ଲେଖ।

କାର୍ଯ୍ୟକ୍ଷମ ଉଦାହରଣ

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

ଗୋଲାକାର ହେଉଛି ଶେଷ ପଦକ୍ଷେପରେ, ଯେତେବେଳେ ପ୍ରତ୍ୟେକ ଚ୍ୟାନେଲକୁ 0–255 ର ସଂପୁର୍ଣ୍ଣ ମୂଲ୍ୟରେ ନଜରଦ୶ାଯାଏ। ଫଳାଫଳ ତୁମ HSL ଇନପୁଟ୍‌କୁ ଅତ୍ୟନ୍ତ ନିକଟତମ HEX କୋଡ୍ ଦିଏ ଏବଂ ସାଧାରଣତଃ ଏହା design tool ଯେଉଁଥିରେ ଦେଖାଯାଏ ସହିତ ପରିଚିତ ହୁଏ।

HSL ଓ HEX ବ୍ୟାଖ୍ୟା

HSL କ'ଣ?

HSL ଗୋଟିଏ ରଙ୍ଗକୁ hue (ରଙ୍ଗଚକ୍ରରେ 0–360°), saturation (କେତେ ରଙ୍ଗୀନ, 0–100%) ଏବଂ lightness (କେତେ ଉଜ୍ଜ୍ୱଳ, 0–100%) ଭାଗରେ ବିଭାଜିତ କରେ। ପ୍ରତ୍ୟେକ ଅଂଶ ଲୋକେ କିପରି ରଙ୍ଗ କୁଣ୍ଡଳୀ ବର୍ଣ୍ଣନା କରନ୍ତି ସେଇପରି ମେଳ ଖାଏ, ତେଣୁ HSL ହାତୋଲା ଭାବରେ କିମ୍ବା କୋଡ୍ ମାଧ୍ୟମରେ ଟିଣ୍ଟ, ଶେଡ୍ ଓ ସଙ୍ଗତିପୂର୍ଣ୍ଣ ପ୍ୟାଲେଟ୍ ତିଆରି କରିବାକୁ ସରଳ।

ସିନ୍ଟାକ୍ସ:
hsl(H, S%, L%)
ରେଞ୍ଜ:
0–360°, 0–100%, 0–100%
ଶ୍ରେଷ୍ଠ ପାଇଁ:
palettes, tints and shades, theming

HEX କ'ଣ?

HEX କୋଡ୍ ହେଉଛି ଏକ ଛଅ-ଅଙ୍କର ହେକ୍ସାଡେସିମାଲ୍ ସଂଖ୍ୟା ଯାହା ଏକ ଆଗର # ସହିତ ରଙ୍ଗର ଲାଲ, ସବୁଜ ଓ ନୀଳ ଚ୍ୟାନେଲ୍ ସଂରକ୍ଷଣ କରେ। ପ୍ରତ୍ୟେକ ଜୋଡ଼ା ଡିଜିଟ୍ ଗୋଟିଏ ଚ୍ୟାନେଲ୍କୁ କଭର୍ କରେ, 00 (କେହି ନାହିଁ) ଠାରୁ FF (ପୂରା) ପର୍ଯ୍ୟନ୍ତ, ଯାହା RGB ର 16.7 ମିଲିଅନ୍ ରଙ୍ଗକୁ ସଂକ୍ଷିପ୍ତ ଭାବରେ ପ୍ରତିନିଧିତ୍ୱ କରେ। HEX CSS, ଡିଜାଇନ୍ ଟୁଲ୍ ଏବଂ brand guidelines ରେ ଡିଫଲ୍ଟ ଅଟକାଉଛି।

ସିନ୍ଟାକ୍ସ:
#RRGGBB
ରେଞ୍ଜ:
00–FF per channel
ଶ୍ରେଷ୍ଠ ପାଇଁ:
CSS, design handoff, brand guidelines

HSL କୁ HEX ରେଫରେନ୍ସ ଟେବୁଲ୍

ସବୁଠାରୁ ସାଧାରଣ 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

ଅଧିକ ରଙ୍ଗ ପରିବର୍ତ୍ତକ

ପ୍ରଶ୍ନୋତ୍ତର

saturation ଓ lightness କୁ ଭାଗ ଭଳେ ପରିବର୍ତ୍ତନ କର: 60% ହେବ 0.6। chroma C = (1 − |2L − 1|) × S ଗଣନା କର — ଏହା ଦର୍ଶାଏ ରଙ୍ଗ କେତେ ଧରଣର ଗ୍ରେ (grey) ଠାରୁ ଦୂରରେ ଅଛି। hue ବ୍ୟବହାର କରି ସେଇ chroma କୁ ଲାଲ୍, ହରିତ ଓ ନୀଳ ଚ୍ୟାନେଲରେ ରଖ, ତାପରେ ସବୁ ତିନୋଟି କୁ L − C/2 ଦ୍ୱାରା ସ୍ଥାନାନ୍ତର କର। ପ୍ରତ୍ୟେକ ଚ୍ୟାନେଲକୁ 255 ରେ ଗୁଣ କର, ଘନା କର (round), ଏବଂ ତାହାକୁ ଦୁଇ ହେକ୍ସାଡେସିମାଲ୍ ଡିଜିଟ୍ ଭାବେ ଲେଖ।

ଗୋଲାକାର ହେଉଛି ଶେଷ ପଦକ୍ଷେପରେ, ଯେତେବେଳେ ପ୍ରତ୍ୟେକ ଚ୍ୟାନେଲକୁ 0–255 ର ସଂପୁର୍ଣ୍ଣ ମୂଲ୍ୟରେ ନଜରଦ୶ାଯାଏ। ଫଳାଫଳ ତୁମ HSL ଇନପୁଟ୍‌କୁ ଅତ୍ୟନ୍ତ ନିକଟତମ HEX କୋଡ୍ ଦିଏ ଏବଂ ସାଧାରଣତଃ ଏହା design tool ଯେଉଁଥିରେ ଦେଖାଯାଏ ସହିତ ପରିଚିତ ହୁଏ।

HEX କୋଡ୍ ହେଉଛି ଏକ ଛଅ-ଅଙ୍କର ହେକ୍ସାଡେସିମାଲ୍ ସଂଖ୍ୟା ଯାହା ଏକ ଆଗର # ସହିତ ରଙ୍ଗର ଲାଲ, ସବୁଜ ଓ ନୀଳ ଚ୍ୟାନେଲ୍ ସଂରକ୍ଷଣ କରେ। ପ୍ରତ୍ୟେକ ଜୋଡ଼ା ଡିଜିଟ୍ ଗୋଟିଏ ଚ୍ୟାନେଲ୍କୁ କଭର୍ କରେ, 00 (କେହି ନାହିଁ) ଠାରୁ FF (ପୂରା) ପର୍ଯ୍ୟନ୍ତ, ଯାହା RGB ର 16.7 ମିଲିଅନ୍ ରଙ୍ଗକୁ ସଂକ୍ଷିପ୍ତ ଭାବରେ ପ୍ରତିନିଧିତ୍ୱ କରେ। HEX CSS, ଡିଜାଇନ୍ ଟୁଲ୍ ଏବଂ brand guidelines ରେ ଡିଫଲ୍ଟ ଅଟକାଉଛି।

ହଁ. ଇନ ପୁଟ୍ ନିକଟରେ ଥିବା swap ବଟନ୍ ତୁମକୁ HEX ଠାରୁ HSL କନଭର୍ଟରକୁ ନେଉଛି, ଯାହା ଏଇ ପ୍ରକ୍ରିୟାରେ ସମାନ ଭାବରେ କାମ କରେ। ଦୁହିଙ୍କ ଦିଗ ଗଣିତ ଏକେଇ ଫର୍ମୁଲା ବ୍ୟବହାର କରେ, ସେହି ଫର୍ମୁଲାକୁ ପଛୁଆ ଭାବରେ ଲାଗୁ କରିବାକୁ ହୁଏ।

palette ଟି HSL ରେ ତିଆରି କର, ପରେ HEX ଏକ୍ସପୋର୍ଟ କର। palette ତାଙ୍କର ଲଜିକ୍ ରଖେ — ଏକେ hue, ଧାରାବାହିକ lightness — ଯେତେବେଳେ ଡେଲିଭର୍ କୋଡ୍ ଡିଭେଲପର୍ମାନେ ଆଶା କରନ୍ତି ଏହି ଫର୍ମାଟ୍ ରେ ରହିଥାଏ।