ছবি থেকে রঙ বাছাই

ওয়েবসাইটের বোতাম, লোগোর অক্ষর কিংবা ফেসবুক পোস্টারের ব্যাকগ্রাউন্ড — সব ডিজাইনেই রঙের কোড লাগে। একটি সুন্দর রঙ চোখে পড়লেও তার নাম বলা যায় না, কারণ কম্পিউটারে রঙ চেনা হয় সংখ্যা দিয়ে। HEX কোড হলো সবচেয়ে পরিচিত রূপ, যেমন টিল রঙের কোড #0F766E। RGB রূপে একই রঙ লেখা হয় rgb(15, 118, 110), আর HSL রূপে লেখা হয় hsl(175, 77%, 26%)। এই টুলটি সেই কাজটাই সহজ করে দেয়, আর আপনার ছবি কোথাও আপলোড না করেই।

কীভাবে ব্যবহার করবেন

1. উপরের ছবি বেছে নিন ঘরে ক্লিক করে আপনার ডিভাইস থেকে একটি ছবি বেছে নিন। JPG, PNG বা WebP — যেকোনো সাধারণ ছবি চলবে।
2. ছবিটি টুলের ভেতরে দেখা গেলে ছবির যেকোনো জায়গায় ক্লিক করুন। ক্লিক করা পিক্সেলের রঙ নিচে বড় সোয়াচসহ দেখা যাবে।
3. HEX, RGB ও HSL — তিনটি ফরম্যাটই টেবিলে দেখা যাবে। যেটি দরকার, তার পাশের কপি বোতামে ক্লিক করুন।
4. একাধিক রঙ বাছাই করলে সেগুলো নিচের প্যালেটে জমা হয়। প্যালেটের কোনো রঙে ক্লিক করলে তার HEX কোড কপি হয়।
5. ছবি ছাড়া কাজ করতে চাইলে ম্যানুয়াল ঘরে HEX কোড লিখে রঙ দেখুন বোতামে ক্লিক করুন। যেমন #FF0000 লিখলে লাল রঙের সোয়াচ আর তার RGB ও HSL দেখা যাবে।
6. সব ফরম্যাট একসাথে কপি করতে ফলাফল কপি করুন বোতামে ক্লিক করুন। নতুন ছবি নিয়ে কাজ করতে রিসেট করুন বোতামে ক্লিক করুন। প্রথমবার উদাহরণ বসান বোতামে ক্লিক করে দেখে নিন।

একটি বাস্তব উদাহরণ

ধরুন, আপনার ওয়েবসাইটের মূল রঙ টিল, আর তার কোড জানতে চান। উদাহরণ বসান বোতামে ক্লিক করলে ম্যানুয়াল ঘরে #0F766E বসে আর ফলাফল আসে এরকম: HEX #0F766E, RGB rgb(15, 118, 110), HSL hsl(175, 77%, 26%)। হিসাবটি এরকম: HEX-এর প্রথম দুই অঙ্ক 0F মানে দশমিক ১৫, যা লালের মান; মাঝের দুই অঙ্ক 76 মানে দশমিক ১১৮, যা সবুজের মান; শেষ দুই অঙ্ক 6E মানে দশমিক ১১০, যা নীলের মান। দ্বিতীয় উদাহরণ দেখি। লাল রঙের কোড #FF0000 লিখলে ফলাফল আসে: RGB rgb(255, 0, 0), আর HSL hsl(0, 100%, 50%)। এখানে লালের মান সর্বোচ্চ ২৫৫, সবুজ আর নীল শূন্য, তাই রঙের কোণ শূন্য ডিগ্রি, সম্পৃক্ততা ১০০ শতাংশ আর উজ্জ্বলতা ৫০ শতাংশ। তৃতীয় উদাহরণ: সাদা রঙ rgb(255, 255, 255) লিখে রূপান্তর করলে HEX আসে #FFFFFF। এই তিনটি ফলাফলই Node-এ চালিয়ে যাচাই করা হয়েছে, তাই ফলাফল ঠিক এইরকমই আসবে।

ফলাফল বুঝবেন কীভাবে

ফলাফলে প্রথমে একটি বড় রঙের সোয়াচ দেখা যায়, যাতে চোখে রঙটি মিলিয়ে নেওয়া যায়। তার নিচে তিনটি লাইন থাকে। HEX লাইনটি ছয় অঙ্কের কোড, যা ওয়েব ডিজাইনে সবচেয়ে বেশি ব্যবহৃত হয়। RGB লাইনে লাল, সবুজ আর নীল — এই তিনটি আলোর মান ০ থেকে ২৫৫-এর মধ্যে দেখানো হয়। HSL লাইনে রঙের কোণ ০ থেকে ৩৬০ ডিগ্রি, সম্পৃক্ততা শতাংশে, আর উজ্জ্বলতা শতাংশে দেখানো হয়। HSL পড়তে পারলে রঙ হালকা বা গাঢ় করা সহজ হয়: উজ্জ্বলতা বাড়ালে রঙ হালকা হয়, কমালে গাঢ় হয়। সম্পৃক্ততা কমালে রঙ ফিকে হয়ে ধূসর রঙের দিকে যায়।

সাধারণ ভুল

সবচেয়ে সাধারণ ভুল হলো ছবির ছোট থাম্বনেইল দেখে রঙ অনুমান করা। একই রঙ ছোট আকারে একরকম আর বড় আকারে অন্যরকম লাগতে পারে, তাই সরাসরি পিক্সেলে ক্লিক করে কোড নেওয়াই ঠিক। দ্বিতীয় ভুল হলো HEX কোডে ভুল অক্ষর লেখা। HEX-এ শুধু ০ থেকে ৯ আর A থেকে F পর্যন্ত অক্ষর চলে; G বা অন্য অক্ষর থাকলে টুলটি বাংলা ভুল বার্তা দেখায়। তৃতীয় ভুল হলো তিন অঙ্কের সংক্ষিপ্ত কোড ভুল বোঝা। #F00 মানে #FF0000, অর্থাৎ প্রতিটি অঙ্ক দুইবার লেখা হয়। চতুর্থ ভুল হলো চাপা বা গ্রেডিয়েন্ট ছবির এক জায়গার রঙ নিয়ে পুরো ছবির রঙ ধরে নেওয়া। গ্রেডিয়েন্টে প্রতিটি পিক্সেলের রঙ আলাদা, তাই কয়েক জায়গায় ক্লিক করে প্যালেট বানিয়ে নেওয়া ভালো।

সতর্কতা

এই টুলটি আপনার ছবি কোথাও পাঠায় না, তাই ব্যক্তিগত ছবি নিয়েও নিশ্চিন্তে ব্যবহার করা যায়। তবে অন্যের তোলা ছবি বা কপিরাইটযুক্ত ডিজাইন থেকে রঙ নিয়ে নিজের বাণিজ্যিক কাজে ব্যবহারের আগে অনুমতির বিষয়টি ভেবে দেখুন। ছবির রঙের কোড স্ক্রিনের সেটিংস অনুযায়ী চোখে একটু আলাদা লাগতে পারে, কিন্তু কোডটি ছবির আসল তথ্য থেকেই নেওয়া হয়। প্রিন্টের কাজে HEX বা RGB নয়, CMYK মান লাগে — এই টুলটি ওয়েব ও স্ক্রিনের রঙের জন্য, প্রিন্টের রঙ মেলাতে হলে প্রিন্টারের প্রোফাইল দেখে নিন।

FAQ

প্রশ্ন: আমার ছবি কি সার্ভারে আপলোড হয়?
উত্তর: না, একদমই হয় না। ছবিটি শুধু আপনার ব্রাউজারে খোলা হয়, কোনো সার্ভারে পাঠানো হয় না। পাতা বন্ধ করলেই ছবিটি মুছে যায়।

প্রশ্ন: #0F766E কোডটির RGB ও HSL মান কী?
উত্তর: RGB rgb(15, 118, 110), আর HSL hsl(175, 77%, 26%)। টুলে #0F766E লিখে রঙ দেখুন বোতামে ক্লিক করলেই এই ফলাফল আসে।

প্রশ্ন: তিন অঙ্কের HEX কোড, যেমন #F00, কি চলবে?
উত্তর: হ্যাঁ, চলবে। #F00 মানে #FF0000, অর্থাৎ লাল রঙ। টুলটি তিন অঙ্কের কোডকে ছয় অঙ্কে রূপান্তর করে ফলাফল দেখায়।

প্রশ্ন: একসাথে অনেকগুলো রঙ সংগ্রহ করা যায় কি?
উত্তর: হ্যাঁ, যায়। ছবিতে একের পর এক ক্লিক করলে রঙগুলো নিচের প্যালেটে জমা হয়, সর্বোচ্চ ১২টি। প্যালেটের কোনো রঙে ক্লিক করলে তার HEX কোড কপি হয়।