ରଙ୍ଗ କୋଡ୍ ଜେନେରେଟର ଏବଂ ପିକର୍

ରଙ୍ଗ କୋଡ୍, ପ୍ରକାର, ସମନ୍ୱୟ ଉତ୍ପାଦନ କରନ୍ତୁ ଏବଂ ବିପରୀତ ଅନୁପାତ ଯାଞ୍ଚ କରନ୍ତୁ।

ରଙ୍ଗ ପରିବର୍ତ୍ତନ

HEX

#f2f2f2

Concrete

HEX
#f2f2f2
HSL
0, 0, 95
RGB
242, 242, 242
XYZ
84, 89, 97
CMYK
0, 0, 0, 5
LUV
95,16,7
LAB
95, 0, 0
HWB
0, 95, 5

ପ୍ରକାରଭେଦ

ଏହି ଅଂଶର ଉଦ୍ଦେଶ୍ୟ ହେଉଛି ତୁମର ଚୟନିତ ରଙ୍ଗର ଶୁଦ୍ଧ ସଫେଦ ଯୋଗ କରାଯାଇଥିବା ଟିଣ୍ଟସ୍ ଏବଂ ଶୁଦ୍ଧ କଳା ଯୋଗ କରାଯାଇଥିବା ଶେଡସ୍ 10% ବୃଦ୍ଧିରେ ନିଖୁତ ଭାବରେ ଉତ୍ପାଦନ କରିବା।

ପ୍ରୋ ଟିପ୍: ହୋଭର୍ ସ୍ଥିତି ଏବଂ ଛାୟା ପାଇଁ ଶେଡସ୍ ବ୍ୟବହାର କରନ୍ତୁ, ହାଇଲାଇଟ୍ ଏବଂ ପୃଷ୍ଠଭୂମି ପାଇଁ ଟିଣ୍ଟସ୍ ବ୍ୟବହାର କରନ୍ତୁ।

ଶେଡସ୍

ତୁମର ଆଧାର ରଙ୍ଗକୁ କଳା ଯୋଗ କରି ତିଆରି ହୋଇଥିବା ଅଧିକ ଅନ୍ଧକାର ପ୍ରକାରଭେଦ।

ଟିଣ୍ଟସ୍

ତୁମର ଆଧାର ରଙ୍ଗକୁ ସଫେଦ ଯୋଗ କରି ତିଆରି ହୋଇଥିବା ଅଧିକ ହାଲୁକା ପ୍ରକାରଭେଦ।

ସାଧାରଣ ବ୍ୟବହାର ମାମଲା

  • UI ଉପାଦାନ ସ୍ଥିତିଗୁଡିକ (ହୋଭର୍, ସକ୍ରିୟ, ଅସକ୍ରିୟ)
  • ଛାୟା ଏବଂ ହାଇଲାଇଟ୍ ସହିତ ଗଭୀରତା ସୃଷ୍ଟି କରିବା
  • ସମାନ ରଙ୍ଗ ପ୍ରଣାଳୀ ତିଆରି କରିବା

ଡିଜାଇନ୍ ସିଷ୍ଟମ୍ ଟିପ୍

ଏହି ପ୍ରକାରଭେଦଗୁଡିକ ଏକ ସମନ୍ୱିତ ରଙ୍ଗ ପ୍ୟାଲେଟର ଭିତ୍ତି ତିଆରି କରନ୍ତି। ସମଗ୍ର ପ୍ରକଳ୍ପରେ ସମନ୍ୱୟ ରଖିବା ପାଇଁ ସେଗୁଡିକୁ ରପ୍ତାନି କରନ୍ତୁ।

ରଙ୍ଗ ସଂଯୋଗଗୁଡିକ

ପ୍ରତ୍ୟେକ ସମନ୍ୱୟର ନିଜର ମନୋଭାବ ଅଛି। ଭଲ ଭାବରେ କାମ କରୁଥିବା ରଙ୍ଗ ସଂଯୋଗଗୁଡିକ ଭାବିବା ପାଇଁ ସମନ୍ୱୟଗୁଡିକ ବ୍ୟବହାର କରନ୍ତୁ।

କିପରି ବ୍ୟବହାର କରିବେ

ଯେକୌଣସି ରଙ୍ଗ ଉପରେ କ୍ଲିକ୍ କରି ତାହାର ହେକ୍ସ ମୂଲ୍ୟକୁ କପି କରନ୍ତୁ। ଏହି ସଂଯୋଗଗୁଡିକ ଦୃଶ୍ୟ ସମନ୍ୱୟ ସୃଷ୍ଟି କରିବାକୁ ଗଣିତ ଦ୍ୱାରା ପ୍ରମାଣିତ।

କାହିଁକି ଏହା ଗୁରୁତ୍ୱପୂର୍ଣ୍ଣ

ରଙ୍ଗ ସମନ୍ୱୟଗୁଡିକ ସମତା ସୃଷ୍ଟି କରନ୍ତି ଏବଂ ତୁମର ଡିଜାଇନ୍‌ଗୁଡିକରେ ନିର୍ଦ୍ଦିଷ୍ଟ ଭାବନା ସୃଷ୍ଟି କରନ୍ତି।

ପୂରକ

ଏକ ରଙ୍ଗ ଏବଂ ରଙ୍ଗ ଚକ୍ରରେ ଏହାର ବିପରୀତ, +180 ଡିଗ୍ରୀ ହ୍ୟୁ। ଉଚ୍ଚ ବିପରୀତ।

#f2f2f2
ସବୁଠାରୁ ଭଲ: ଉଚ୍ଚ-ପ୍ରଭାବଶାଳୀ ଡିଜାଇନ୍, CTA, ଲୋଗୋଗୁଡିକ

ବିଭକ୍ତ ପୂରକ

ଏକ ରଙ୍ଗ ଏବଂ ଏହାର ପୂରକର ଦୁଇଟି ସମୀପସ୍ଥ ରଙ୍ଗ, ମୂଖ୍ୟ ରଙ୍ଗର ବିପରୀତ ମୂଲ୍ୟରୁ +/-30 ଡିଗ୍ରୀ ହ୍ୟୁ। ସିଧା ପୂରକ ଭଳି ଧୃଷ୍ଟ, କିନ୍ତୁ ଅଧିକ ବହୁମୁଖୀ।

ସବୁଠାରୁ ଭଲ: ଜୀବନ୍ତ କିନ୍ତୁ ସମତୁଳିତ ଲେଆଉଟ୍

ତ୍ରିକୋଣୀୟ

ରଙ୍ଗ ଚକ୍ରରେ ସମାନ ଭାବରେ ବିସ୍ତାରିତ ତିନୋଟି ରଙ୍ଗ, ପ୍ରତ୍ୟେକ 120 ଡିଗ୍ରୀ ହ୍ୟୁ ଅଲଗା। ଏକ ରଙ୍ଗକୁ ପ୍ରମୁଖ ଭାବରେ ଅନୁମତି ଦେବା ଏବଂ ଅନ୍ୟମାନଙ୍କୁ ସାହାଯ୍ୟ ଭାବରେ ବ୍ୟବହାର କରିବା ଉଚିତ।

ସବୁଠାରୁ ଭଲ: ମଜାଦାର, ଉର୍ଜାବାନ ଡିଜାଇନ୍

ସମାନ

ସମାନ ଉଜ୍ଜ୍ୱଳତା ଏବଂ ସାତୁରେସନ୍ ଥିବା ତିନୋଟି ରଙ୍ଗ ଯାହା ରଙ୍ଗ ଚକ୍ରରେ ସମୀପସ୍ଥ ହ୍ୟୁ ସହିତ, 30 ଡିଗ୍ରୀ ଅଲଗା। ସ୍ମୂଥ ଟ୍ରାନ୍ସିସନ୍।

ସବୁଠାରୁ ଭଲ: ପ୍ରକୃତି-ପ୍ରେରିତ, ଶାନ୍ତିଦାୟକ ଇଣ୍ଟରଫେସ୍

ଏକରୂପୀ

ସମାନ ହ୍ୟୁ ଥିବା ତିନୋଟି ରଙ୍ଗ ଯାହାର ଉଜ୍ଜ୍ୱଳତା ମୂଲ୍ୟ +/-50%। ସୂକ୍ଷ୍ମ ଏବଂ ସୁନ୍ଦର।

ସବୁଠାରୁ ଭଲ: ନ୍ୟୁନତମ, ସୁକୁମାର ଡିଜାଇନ୍

ଚତୁର୍ଭୁଜୀୟ

ଦୁଇ ଜୋଡ଼ି ପୂରକ ରଙ୍ଗ, ଯାହା 60 ଡିଗ୍ରୀ ହ୍ୟୁ ଦ୍ୱାରା ବିଭକ୍ତ ହୋଇଛି।

ସବୁଠାରୁ ଭଲ: ସମୃଦ୍ଧ, ବିବିଧ ରଙ୍ଗ ସ୍କିମ୍

ରଙ୍ଗ ସିଦ୍ଧାନ୍ତ ସୂତ୍ର

ସମତୁଳନ

ଗୋଟିଏ ପ୍ରମୁଖ ରଙ୍ଗ ବ୍ୟବହାର କରନ୍ତୁ, ଦ୍ୱିତୀୟକୁ ସମର୍ଥନ କରନ୍ତୁ, ଏବଂ ସାହାଯ୍ୟକୁ ସାବଧାନରେ ବ୍ୟବହାର କରନ୍ତୁ।

ବିପରୀତ

ପଢ଼ିବା ଏବଂ ପ୍ରବେଶାଧିକାର ପାଇଁ ପର୍ଯ୍ୟାପ୍ତ ବିପରୀତତା ସୁନିଶ୍ଚିତ କରନ୍ତୁ।

ସମନ୍ୱୟ

ରଙ୍ଗଗୁଡ଼ିକ ଏକତାପୂର୍ଣ୍ଣ ଭିଜୁଆଲ୍ ଅନୁଭବ ସୃଷ୍ଟି ପାଇଁ ଏକାଠି କାମ କରିବା ଉଚିତ।

ରଙ୍ଗ ବିପରୀତତା ଯାଞ୍ଚକାରୀ

ପାଠ୍ୟ ପଠନୀୟତା ପାଇଁ WCAG ପ୍ରାପ୍ୟତା ମାନଦଣ୍ଡ ପୂରଣ କରିବାକୁ ନିଶ୍ଚିତ କରିବା ପାଇଁ ରଙ୍ଗ ସଂଯୋଗଗୁଡ଼ିକ ପରୀକ୍ଷା କରନ୍ତୁ।

ପାଠ୍ୟ ରଙ୍ଗ
ପୃଷ୍ଠଭୂମି ରଙ୍ଗ
ବିପରୀତତା
1.00
Fail
ଅତ୍ୟନ୍ତ ଖରାପ
ଛୋଟ ପାଠ୍ୟ
✖︎
ବଡ଼ ପାଠ୍ୟ
✖︎
WCAG ମାନଦଣ୍ଡ
AA:ସାଧାରଣ ପାଠ୍ୟ ପାଇଁ 4.5:1 ର ନ୍ୟୁନତମ ବିପରୀତତା ଅନୁପାତ ଏବଂ ବଡ଼ ପାଠ୍ୟ ପାଇଁ 3:1। ଅଧିକାଂଶ ୱେବସାଇଟ୍ ପାଇଁ ଆବଶ୍ୟକ।
AAA:ସାଧାରଣ ପାଠ୍ୟ ପାଇଁ 7:1 ର ବୃଦ୍ଧିତ ବିପରୀତତା ଅନୁପାତ ଏବଂ ବଡ଼ ପାଠ୍ୟ ପାଇଁ 4.5:1। ସର୍ବୋପରି ପ୍ରାପ୍ୟତା ପାଇଁ ସୁପାରିଶ କରାଯାଇଛି।
ସମସ୍ତ ଟେକ୍ସଟ୍ ସାଇଜ ପାଇଁ ଅପର୍ଯ୍ୟାପ୍ତ ବିପରୀତ - WCAG ମାନକରେ ବିଫଳ।

ଉନ୍ନତ କନ୍ଟ୍ରାଷ୍ଟ ଚେକର୍

ସ୍ଲାଇଡର୍, ଅନେକ ପ୍ରିଭ୍ୟୁ ଏବଂ ଅଧିକ ସହିତ ସଂଶୋଧନ କରନ୍ତୁ

ସବୁଠି ଜଣେ ଜୀନିଅସ୍ ଅଟେ। କିନ୍ତୁ ଯଦି ତୁମେ ଗଛ ଚଢ଼ିବାରେ ଏକ ମାଛକୁ ବିଚାର କର, ତେବେ ଏହା ଏହାର ସମଗ୍ର ଜୀବନ ଜୀବନ୍ତ ରହିବ ଯେ ଏହା ମୂର୍ଖ।

- Albert Einstein

ପ୍ରାଯୋଗିକ ଫର୍ମାଟ୍‌ସ

ପ୍ରାୟୋଗିକ ଫର୍ମାଟ୍‌ଗୁଡ଼ିକ

ରଙ୍ଗ ବିଶ୍ଳେଷଣ

ଦୃଷ୍ଟିହୀନତା ସିମ୍ୟୁଲେଟର୍

ସୃଜନଶୀଳ ପ୍ରାସଙ୍ଗିକତା