স্ক্রিনে রঙ বসানোর কয়েকটি পদ্ধতি কোডিং-এ আছে। Hex, RGBA, এবং HSLA—এই তিনটি সবচেয়ে কমন রঙ কোড সিস্টেম।
আপনি হয়তো Hex কোড এবং RGB-র সাথে পরিচিত, কিন্তু HSL, যা মানবের জন্য আরও পাঠযোগ্য, হয়তো এখনো আপনার রডারে নেই। রঙ লেখার প্রতিটি পদ্ধতি আলাদা পরিস্থিতিতে অর্থपूर्ण, এবং প্রতিটির বেসিক বোঝাপড়া থাকলে আপনি সঠিক সিদ্ধান্ত নিতে পারবেন। এখানে আমরা RGB, HEX এবং HSL-এর পার্থক্য ব্যাখ্যা করব।
RGB কী (Red, Green, Blue)
RGB ভ্যালু থেকে শুরু করা যৌক্তিক, কারণ লাল, সবুজ, এবং নীল—এই তিনটি রঙ স্ক্রিন প্রায় সব রঙ তৈরি করতে ব্যবহার করে। এটি "অ্যাডিটিভ কালার মিক্সিং"-এর মাধ্যমে করে, কিন্তু বুঝতে সেটির বিজ্ঞান জানার প্রয়োজন নেই।
rgb(255, 0, 0) হলো লাল, কারণ R ম্যাক্সিমাম। G বা B কে ২৫৫ করলে পূর্ণ সবুজ বা নীল পাবেন। তিনটাকেই ২৫৫ করলে সাদা (সব রঙের যোগফল) এবং শূন্য করলে কালো। চতুর্থ ভ্যালু (আলফা চ্যানেল, ০ থেকে ১) যোগ করলে ট্রান্সপারেন্সি পাবেন: rgba(0, 0, 0, .5) হলো অর্ধ-ট্রান্সপারেন্ট কালো।
এটি সিম্পল, কিন্তু সত্যিকারের ইন্টিউইটিভ নয়। রঙের শেড চেঞ্জ করলেই RGB ব্যালেন্স काफी পরিবর্তন হয়, যা কোনো RGB জেনারেটর ছাড়া মানবের জন্য ম্যানুয়ালি অ্যাডজাস্ট করা খুব কঠিন (সৌভাগ্যয়, solchen অনেক আছে)।
হেক্সাডেসিমাল রঙ কোড কী
Hex-গুলো RGB ভ্যালু লেখার অন্য একটি পদ্ধতি মাত্র। #6a79f7 (কর্নফ্লাওয়ার ব্লু) সরাসরি rgb(106, 121, 247)-এ ম্যাপ হয়। 6a হলো লাল, 79 হলো সবুজ, এবং f7 হলো নীল।
প্রথমে জানতে হলে হেক্স কালার সিস্টেমে "a-f" অক্ষরগুলো দশ থেকে পনেরো সংখ্যা বোঝায়। দ্বিতীয়ত, এটি হেক্সাডেসিমাল, মানে সব বেস ১৬-এ। বেস ১০-এ ২১ মানে 2 * 10 + 1, কিন্তু হেক্সাডেসিমালে এটি 2 * 16 + 1। প্রথম সংখ্যা ১৬ দিয়ে গুণ করে দ্বিতীয় সংখ্যা যোগ করলেই হয়—ততটুকু সহজ! 6a = 6 * 16 + 10 অর্থাৎ ১০৬। 79 = 7 * 16 + 9 অর্থাৎ ১২১।
গণিতটা মজার হলেও, এটি হেক্স কোডকে মানবের জন্য RGB-চেয়ে বেশি কষ্টদায়ক করে, যদিও এগুলো কপি-পেস্ট করা সহজ এবং মেমorable লেটার/নাম্বার কম্বিনেশন বানানো যায়।
হেক্স কোডেও ট্রান্সপারেন্সি যোগ করা যায় ২৫৫-এর কিছু পーセন্টের সমতুল্য ভ্যালু শুরুরে বসিয়ে: #806a79f7। হেক্সाडেসিমালে 80 = ১২৬, যা ২৫৫-এর ম্যাক্সিমাম ভ্যালুর تقريبًا ৫০%।
HSL কী (Hue, Saturation, Lightness)
HSL মোটামুটি মানব পাঠযোগ্যতার জন্য ডিজাইন করা হয়েছিল, এবং এটি RGB অল্টারনেটিভ হিসেবে জনপ্রিয় হচ্ছে। এটি যেন কাজ করে:
Hue (হিউ) মানে রঙ, এবং এটি কালার হুইলের ডিগ্রি ব্যবহার করে বলে দেয় আপনি কোন রঙে আছেন। কালার হুইল এবং প্রধান রঙদের পজিশন জানলে, ৪৫ হবে نارাঞ্জি এবং ২৭০ হবে বেগুনি—এটি এক সেকেন্ড চিন্তা করলেই বুঝতে পারবেন।
- ০ = লাল
- ৬০ = হলুদ
- ১২০ = সবুজ
- ১৮০ = সায়ান
- ২৪০ = নীল
- ৩০০ = মেজেন্টা
Saturation (স্যাচুরেশন) আসলে রঙটি কতটুকু রঙিন। ০% স্যাচুরেশন মানে রঙটি শুধু একটি গ্রে শেড, ১০০% মানে ফুল স্ট্রেঙ্গথে দেখাবে। রঙ মিউট করুন বা পপ করুন—এই ভ্যালু চেঞ্জ করলেই হয়।
Lightness (লাইটনেস) বলে রঙ কত গাড়া বা উজ্জ্বল। ০% লাইটনেস মানে কালো (Hue বা Saturation যেকোনো হোক), ১০০% মানে সাদা। অনুমান করুন ৫০% দিয়ে সবচেয়ে সঠিক রঙ পাওয়া যায়।
এই তথ্যে, আপনি ইনস্ট্যান্টলি বুঝতে পারবেন hsl(0, 100%, 50%) কী। সেটি শুধু লাল! গাড়া, রিচ লাল চাইলে 0, 70%, 40% ট্রাই করুন। সেটা নীলতে চাইলে? ০ কে ২৪০ করুন, হয়ে গেলো! এটেও ট্রান্সপারেন্সি আছে—RGB-এর মতো: চতুর্থ ভ্যালু (০ থেকে ১) যোগ করুন, যেমন: hsla(240, 70%, 40%, .5)।
HSV/HSB এবং HSI
কী? আরও কালার মডেল? কবে শেষ? কম্পিউটারে রঙ নিয়ে কাজ করে অধিকাংশ মানুষের জন্য এটি ইতিমধ্যে শেষ। Hex, RGB, এবং HSL—এই তিনটিই রঙ নোটেশনের সবচেয়ে কমন পদ্ধতি। আপনি যদি ইমেজ ও রঙ-প্রধান ফিল্ডে থাকেন (যেমন গ্রাফিক ডিজাইন বা ইমেজে মেশিন লার্নিং), তবে এই আরও জটিল কালার মডেল বা অন্য লিস্টেড না থাকা মডেল দেখতে পেতে পারেন।
HSB মানে "Hue Saturation Brightness" এবং HSV মানে "Hue Saturation Value"। আসলে এগুলো একই মডেলের দুটি নাম, এবং HSL-থেকে এর মুখ্য পার্থক্য স্যাচুরেশন ডিফাইন করার পদ্ধতিতে। HSI (Hue Saturation Intensity)-র HSB/HSV-থেকে কিছু মাইনর পার্থক্য আছে, কিন্তু এটি ব্যাপকভাবে ব্যবহৃত হয় না, তাই বাইরে খুব কম দেখবেন।
কোন কালার মডেল ব্যবহার করব?
সাধারণত, কালার মডেল বেছে নেওয়া একটি মাইনর ডিজাইন সিদ্ধান্ত, কিন্তু ভালো জিনিসগুলো অনেক ছোট সিদ্ধান্ত দিয়ে তৈরি হয়। সাধারণত, hex কোড কপি-পেস্ট সহজ করে এবং মানব জড়িত নয় এমন পরিস্থিতিতে চমৎকার। RGB/RGBA পাঠযোগ্যতার দৃষ্টিতে ভালো এবং ট্রান্সপারেন্সি টвиক করতে চাইলে সেটি বেস্ট। যদি মানবকে রঙ ম্যানুয়ালি চেঞ্জ করতে হয়, তবে HSL/HSLA ব্যবহার করুন। এর বাইরে, এটি প্রায় পছন্দের ব্যাপার, যদিও HSL টিমের লোকরা বলা হয় বুদ্ধিমান এবং চমৎকার দেখে! 😉