রঙ বাছাই টুল - RGB, হেক্স, CMYK & HSV রঙ কোড রূপান্তর
তাৎক্ষণিক RGB, হেক্স, CMYK, এবং HSV রূপান্তরের সঙ্গে বিনামূল্যের অনলাইন রঙ বাছাই। ভিজ্যুয়ালি রঙ নির্বাচন করতে স্পেকট্রাম ক্লিক করুন বা সঠিক মান প্রবেশ করান। ওয়েব ডিজাইন, মুদ্রণ এবং ডিজিটাল প্রকল্পগুলির জন্য এক ক্লিকে যেকোনো ফরম্যাট কপি করুন।
রঙ নির্বাচক
আরজিবি (০-২৫৫)
সিএমওয়াইকে (০-১০০)
রঙ নির্বাচক
ডকুমেন্টেশন
এই কালার পিকার দিয়ে আপনি কী করতে পারেন
আপনার প্রকল্পের জন্য নিখুঁত রঙ খুঁজছেন? এই কালার পিকার আপনাকে RGB, হেক্স, CMYK এবং HSV ফরম্যাটের মধ্যে রঙ নির্বাচন, প্রিভিউ এবং রূপান্তর করতে দেয়। আপনি যদি ওয়েবসাইট কোডিং করছেন, লোগো ডিজাইন করছেন, বা মুদ্রণের জন্য ফাইল প্রস্তুত করছেন, তাহলে আপনি সঠিক রঙ মান পাবেন—কোনো অনুমান নয়, কোনো টুলের মধ্যে সুইচ করার প্রয়োজন নেই।
রঙ স্পেকট্রাম যেকোনো জায়গায় ক্লিক করে একটি রঙ নির্বাচন করুন, স্লাইডার দিয়ে উজ্জ্বলতা সামঞ্জস্য করুন, অথবা সরাসরি সঠিক মান প্রবেশ করান। প্রত্যেক ফরম্যাট রিয়েল-টাইমে আপডেট হয়, এবং আপনি একটি ক্লিকে যেকোনো রঙ কোড কপি করতে পারেন।
রঙ মডেল বোঝা
বিভিন্ন প্রকল্পের জন্য বিভিন্ন রঙ ফরম্যাট প্রয়োজন। এখানে প্রত্যেকটি কী করে এবং কখন ব্যবহার করা উচিত তা দেখা যাক:
RGB (লাল, সবুজ, নীল)
RGB লাল, সবুজ এবং নীল আলোকে মিশিয়ে কাজ করে—ঠিক যেভাবে আপনার স্ক্রিন বর্তমানে রঙ প্রদর্শন করে। প্রত্যেক উপাদান 0 থেকে 255 পর্যন্ত রয়েছে:
- RGB(255, 0, 0) = শুদ্ধ লাল
- RGB(0, 255, 0) = শুদ্ধ সবুজ
- RGB(0, 0, 255) = শুদ্ধ নীল
- RGB(255, 255, 255) = সাদা
- RGB(0, 0, 0) = কালো
কখন RGB ব্যবহার করবেন: যেকোনো ডিজিটাল কাজ—ওয়েবসাইট, মোবাইল অ্যাপ, ভিডিও সম্পাদনা, বা স্ক্রিন-ভিত্তিক গ্রাফিক্স। এটি ডিসপ্লের মূল ভাষা, যার কারণে CSS-এর মতো টুলগুলি সরাসরি rgb() এবং rgba() ফাংশন সমর্থন করে। W3C CSS রঙ মডিউল বিশেষজ্ঞ অনুসারে, RGB হল ওয়েব মানের জন্য মৌলিক রঙ মডেল।
হেক্সাডেসিমাল (হেক্স)
হেক্স কোড কেবল RGB মানগুলি বেস-10-এর পরিবর্তে বেস-16-এ লেখা। একটি হেক্স রঙ দেখতে হবে #FF5733, যেখানে:
#চিহ্নটি এটিকে হেক্স কোড হিসাবে চিহ্নিত করে- প্রথম দুটি অক্ষর = লাল (00-FF)
- মধ্যের দুটি = সবুজ (00-FF)
- শেষের দুটি = নীল (00-FF)
#FF0000= লাল,#00FF00= সবুজ,#0000FF= নীল
কখনও কখনও আপনি 3-অক্ষরের সংক্ষিপ্ত রূপ দেখতে পাবেন যেমন #F00 বদলে #FF0000—এটি তখন কাজ করে যখন প্রত্যেক রঙ চ্যানেল একই অঙ্ক পুনরাবৃত্তি করে।
কখন হেক্স ব্যবহার করবেন: ওয়েব ডেভেলপমেন্ট হল প্রাথমিক ব্যবহার ক্ষেত্র। CSS সর্বদা হেক্স নোটেশন সমর্থন করে, এবং বেশিরভাগ ডেভেলপাররা এটিকে rgb() থেকে দ্রুত টাইপ করা বলে মনে করেন। একটি সাধারণ ভুল: # চিহ্ন ভুলে গেলে আপনার স্টাইল নীরবে ভেঙ্গে যাবে, কারণ ব্রাউজাররা এটিকে বৈধ রঙ হিসাবে স্বীকার করবে না।
CMYK (সায়ান, ম্যাজেন্টা, হলুদ, কী/কালো)
CMYK হল মুদ্রকের দ্বারা ব্যবহৃত রঙ মডেল। RGB-এর বিপরীতে (যা আলো যোগ করে), CMYK তা বিয়োগ করে—সাদা কাগজে মিশ্রিত মুদ্রণ রঙ তৈরি করে:
- প্রত্যেক উপাদান 0% থেকে 100% পর্যন্ত রয়েছে
- CMYK(0, 100, 100, 0) = লাল
- CMYK(100, 0, 100, 0) = সবুজ
- CMYK(0, 0, 0, 100) = শুদ্ধ কালো মুদ্রণ
- CMYK(0, 0, 0, 0) = কোনো মুদ্রণ নেই (সাদা কাগজ দেখা যায়)
কখন CMYK ব্যবহার করবেন: মুদ্রণের জন্য ডিজাইন—ব্যবসায়িক কার্ড, ব্রোশার, ম্যাগাজিন, প্যাকেজিং। এখানে বাস্তবতা হল: অনেক উজ্জ্বল RGB রঙ CMYK মুদ্রণে সরলভাবে পুনরুৎপাদন করা যায় না। সেই উজ্জ্বল বিদ্যুৎ নীল যা আপনি স্ক্রিনে দেখেন? মুদ্রিত হলে এটি কম উজ্জ্বল দেখাবে। পেশাদার ডিজাইনাররা সবসময় মুদ্রকে পাঠানোর আগে CMYK রূপান্তর পূর্বরূপ দেখে নেন যাতে কোনো অপ্রত্যাশিত ঘটনা এড়ানো যায়।
HSV (হিউ, সন্তৃপ্তি, মান)
HSV রঙটিকে তিনটি সহজবোধ্য উপাদানে ভাগ করে:
- হিউ: কোন রঙ পরিবার (0-360°)—0° হল লাল, 120° হল সবুজ, 240° হল নীল
- সন্তৃপ্তি: কতটা জীবন্ত বা ধূসর (0-100%)—0% হল গ্রে-স্কেল, 100% হল সম্পূর্ণ সন্তৃপ্ত
- মান: কতটা উজ্জ্বল বা অন্ধকার (0-100%)—0% হল কালো, 100% হল পূর্ণ উজ্জ্বলতা
কেন HSV গুরুত্বপূর্ণ: এটি মানুষের রঙ সম্পর্কে প্রাকৃতিক ভাবে চিন্তা করার পদ্ধতিটিকে মেলে। একটি গাঢ় নীল চাইছেন? মানটি কমান। একটি কম তীব্র নীল চাইছেন? সন্তৃপ্তিটি কমান। এটি HSV-কে রঙ পিকার মতো ইন্টারেক্টিভ টুলের জন্য আদর্শ করে তোলে, যেখানে আপনি স্পেক্ট্রাম থেকে একটি হিউ নির্বাচন করেন এবং স্লাইডারের সাহায্যে উজ্জ্বলতা সামঞ্জস্য করেন।
রঙ রূপান্তর সূত্রাবলী
রঙ নির্বাচক স্বয়ংক্রিয়ভাবে এই গাণিতিক সূত্রগুলি ব্যবহার করে বিভিন্ন রঙ মডেলের মধ্যে রূপান্তর করে:
RGB থেকে Hex রূপান্তর
RGB কে হেক্সাডেসিমালে রূপান্তর করতে:
- প্রত্যেক RGB উপাদানকে (0-255) দ্বি-সংখ্যক হেক্সাডেসিমাল সংখ্যায় রূপান্তর করুন
- তিনটি হেক্সাডেসিমাল মানকে # উপসর্গ সহ একত্রিত করুন
যেখানে toHex() একটি দশমিক সংখ্যাকে তার হেক্সাডেসিমাল প্রতিনিধিত্বে রূপান্তর করে।
RGB থেকে CMYK রূপান্তর
RGB থেকে CMYK রূপান্তরে এই ধাপগুলি অন্তর্ভুক্ত রয়েছে:
- RGB মানগুলিকে 0-1 পরিসরে স্বাভাবিক করুন
- কালো কী (K) উপাদান গণনা করুন
- K এর ভিত্তিতে C, M, এবং Y গণনা করুন
RGB থেকে HSV রূপান্তর
RGB কে HSV-তে রূপান্তর করা:
হিউ (H) এর জন্য:
0° & \text{যদি } \Delta = 0 \\ 60° \times (\frac{G' - B'}{\Delta} \mod 6) & \text{যদি } C_{max} = R' \\ 60° \times (\frac{B' - R'}{\Delta} + 2) & \text{যদি } C_{max} = G' \\ 60° \times (\frac{R' - G'}{\Delta} + 4) & \text{যদি } C_{max} = B' \end{cases}$$ সন্তৃপ্তি (S) এর জন্য: $$S = \begin{cases} 0 & \text{যদি } C_{max} = 0 \\ \frac{\Delta}{C_{max}} \times 100\% & \text{অন্যথায়} \end{cases}$$ মান (V) এর জন্য: $$V = C_{max} \times 100\%$$ ## কালার পিকার কীভাবে ব্যবহার করবেন কালার সঙ্গে কাজ করার তিনটি উপায়: স্পেকট্রাম ক্লিক করুন, সঠিক মান টাইপ করুন, অথবা স্লাইডার দিয়ে সামঞ্জস্য করুন। আপনার কাজের প্রবাহের জন্য যে পদ্ধতিটি স্বাভাবিক মনে হয় সেটি বেছে নিন। ### কালার দৃশ্যভাবে বেছে নিন **কালার স্পেকট্রাম**-এ যেকোনো জায়গায় ক্লিক করে একটি রঙ বেছে নিন। আনুভূমিক অবস্থান হিউ (লাল, সবুজ, নীল ইত্যাদি) নির্বাচন করে, যেখানে উল্ম্ব অবস্থান সাচ্ছন্দ্য (তীব্র বনাম ম্লান) নিয়ন্ত্রণ করে। প্রিভিউ তৎক্ষণাৎ আপডেট হয় যাতে আপনি সঠিক কী পাচ্ছেন তা দেখতে পারেন। **ব্রাইটনেস স্লাইডার**-কে স্পেকট্রাম-এর নিচে টেনে আনুন যাতে আপনার কালারকে হালকা বা গাঢ় করা যায়। এটি HSV পরিভাষায় "মান" উপাদানকে সামঞ্জস্য করে—বাম দিকে গাঢ়, ডান দিকে হালকা। ### সঠিক কালার মান প্রবেশ করান আগে থেকেই জানেন কোন কালার চাই? সরাসরি টাইপ করুন: **হেক্স ফরম্যাট:** `#FF5733` এর মতো কোড প্রবেশ করান। `#` অন্তর্ভুক্ত করতে পারেন বা বাদ দিতে পারেন—টুল দুটোই সামলায়। 3-ডিজিটের সংক্ষিপ্ত রূপও (`#F37`) কাজ করে। **RGB ফরম্যাট:** লাল, সবুজ এবং নীলের জন্য 0-255 মান টাইপ করুন। যদি আনজানে 300 লিখে ফেলেন, তাহলে স্বয়ংক্রিয়ভাবে 255-এ সীমাবদ্ধ করবে। **CMYK ফরম্যাট:** প্রত্যেক মুদ্রণ উপাদানের জন্য শতকরা হার (0-100) প্রবেশ করান। প্রিন্ট ডিজাইনারের নির্দেশাবলী অনুসারে কালার মিলিয়ে নেওয়ার সময় দরকারি। প্রত্যেক ফরম্যাট অন্যগুলিকে রিয়েল-টাইমে আপডেট করে। হেক্স কোড পরিবর্তন করলে RGB/CMYK স্বয়ংক্রিয়ভাবে সামঞ্জস্য হয়। ### কালার কোড কপি করুন যেকোনো কালার ফরম্যাটের পাশের কপি বাটনে (ক্লিপবোর্ড আইকন) ক্লিক করুন। আপনি দ্রুত "কপি করা হয়েছে!" নিশ্চিতকরণ দেখবেন, তারপর সেই মানটি যেখানে প্রয়োজন—CSS ফাইল, ডিজাইন সফটওয়্যার, ডকুমেন্টেশন, যেকোনো জায়গায়—পেস্ট করতে পারবেন। **প্রো টিপ:** বিভিন্ন ফাইল বা অ্যাপ্লিকেশনে কাজ করার সময়, ব্রাউজার ট্যাবে এই টুলটি খোলা রাখুন। আপনি কন্টেক্সট পরিবর্তন ছাড়াই দ্রুত কালার মানগুলি রেফারেন্স এবং কপি করতে পারবেন। ## বাস্তব-পৃথিবীর ব্যবহারের ক্ষেত্রসমূহ ### ওয়েব ডেভেলপমেন্ট আপনি একটি ডার্ক মোড টগল তৈরি করছেন এবং রঙের বৈচিত্র্য প্রয়োজন। হেক্স ফরম্যাটে আপনার ব্রান্ডের প্রাথমিক রঙ দিয়ে শুরু করুন (যেমন, `#3B82F6`), তারপর ব্রাইটনেস স্লাইডার ব্যবহার করে ব্যাকগ্রাউন্ডের জন্য গাঢ় সংস্করণ (`#1E3A8A`) এবং হোভার অবস্থার জন্য হালকা সংস্করণ (`#60A5FA`) তৈরি করুন। প্রত্যেক হেক্স কোড সরাসরি আপনার CSS কাস্টম প্রোপার্টিতে কপি করুন। পারদর্শিতা কাজ করার সময়, RGB মান নিন এবং `rgba()` ফাংশনে ব্যবহার করুন। উদাহরণ স্বরূপ, `rgb(59, 130, 246)` হয়ে যায় `rgba(59, 130, 246, 0.8)` ৮০% অস্বচ্ছতার ওভারলে জন্য। সাধারণ পরিস্থিতি: একজন ক্লায়েন্ট RGB-তে নির্দিষ্ট রঙ সহ একটি Figma ডিজাইন প্রদান করে, কিন্তু আপনি আপনার CSS-এ হেক্স কোড পছন্দ করেন। এখানে ম্যানুয়ালি গণনা করার পরিবর্তে রূপান্তর করুন। ### মুদ্রণের জন্য গ্রাফিক ডিজাইন এখানে CMYK গুরুত্বপূর্ণ হয়ে ওঠে। আপনি RGB রঙে একটি জ্বলন্ত পোস্টার পর্দায় ডিজাইন করেছেন, কিন্তু মুদ্রণকারীর কাছে পাঠানোর আগে, CMYK মানগুলি পরীক্ষা করুন। সেই বিদ্যুৎ সাইয়ান (RGB 0, 255, 255) CMYK(100, 0, 0, 0)-এ রূপান্তরিত হয়—যা ঠিক আছে। কিন্তু সেই উজ্জ্বল পর্দার সবুজ (RGB 0, 255, 0) মুদ্রিত হলে উল্লেখযোগ্যভাবে পরিবর্তিত হতে পারে। পেশাদার কর্মপ্রবাহ: আপনার পর্দার রঙগুলি এখানে ইনপুট করুন, CMYK রূপান্তরগুলি নোট করুন, তারপর আপনার ডিজাইন সফটওয়্যারের CMYK প্রিভিউ মোডে তাদের দৃশ্যভাবে তুলনা করুন। যদি রঙগুলি অত্যধিক পরিবর্তিত হয়, তাহলে ডিজাইন চূড়ান্ত করার আগে আপনার পছন্দগুলি সামঞ্জস্য করুন। এটি মুদ্রণ শপের সাথে "এটি আমার পর্দায় অন্যরকম দেখাচ্ছিল" আলোচনা প্রতিরোধ করে। ### UI/UX ডিজাইন সিস্টেম ডিজাইন সিস্টেম তৈরিতে সামঞ্জস্যপূর্ণ রঙ পরিমাপ প্রয়োজন। একটি প্রাথমিক রঙ দিয়ে শুরু করুন, তারপর বিভিন্ন UI অবস্থার জন্য ৫-১০ টি ব্রাইটনেস পরিবর্তন তৈরি করুন। ব্রাইটনেস স্লাইডার এটিকে দ্রুত করে তোলে—কোনো মানসিক গণনা প্রয়োজন নেই। অ্যাক্সেসিবিলিটির জন্য, টেক্সট এবং ব্যাকগ্রাউন্ডের মধ্যে পর্যাপ্ত বৈপরীত্য প্রয়োজন। যদিও এই টুল কনট্রাস্ট অনুপাত গণনা করে না (সেজন্য আপনার একটি নির্দিষ্ট [WCAG কনট্রাস্ট চেকার](https://www.w3.org/WAI/WCAG21/Understanding/contrast-minimum.html) প্রয়োজন), এটি আপনাকে বিভিন্ন ছায়াগুলি দ্রুত পরীক্ষা করতে সাহায্য করে যতক্ষণ না আপনি এমন সংমিশ্রণ খুঁজে পান যা কাজ করে। বাস্তব পরিস্থিতি: আপনার প্রাথমিক বোতাম `#2563EB` ব্যবহার করে, কিন্তু সেই ব্যাকগ্রাউন্ডে টেক্সট কনট্রাস্ট প্রয়োজনীয়তা পূরণ করতে ব্যর্থ হয়। ব্যাকগ্রাউন্ডটিকে হালকা করুন বা টেক্সটটিকে গাঢ় করুন—তাৎক্ষণিকভাবে বিকল্পগুলি পরীক্ষা করতে প্রিভিউ ব্যবহার করুন। ### ডিজিটাল আর্ট এবং চিত্রাংকন ডিজিটাল অঙ্কনে কাজ করছেন এবং সামঞ্জস্যপূর্ণ রঙ সম্প্রদায় প্রয়োজন? স্পেক্ট্রামে একটি বেস হিউ বেছে নিন, তারপর শুধুমাত্র সন্তৃপ্তি এবং ব্রাইটনেস সামঞ্জস্য করে পরিবর্তনগুলি তৈরি করুন। এটি আপনার প্যালেটকে সংহত রাখে যাতে এলোমেলো রঙ পরিবর্তন না হয়। অনেক ডিজিটাল শিল্পীরা অঙ্কন করার সময় রঙ পিকার খোলা রাখে যাতে দ্রুত রেফারেন্স রঙ ধরে নিতে পারে। কোনো রেফারেন্স ছবিতে একটি নিখুঁত ছায়া টোন দেখলে? এটিকে এখানে ক্লিক করুন (যদি আপনি অন্য কোথাও মান বের করে থাকেন), RGB নিন, এবং Photoshop, Procreate, বা Krita-তে পেস্ট করুন। ### রঙ শিক্ষা এবং পরীক্ষা-নিরীক্ষা রঙ মডেলগুলি কীভাবে সম্পর্কিত তা বুঝতে চান? যেকোনো রঙ বেছে নিন এবং দেখুন কীভাবে তার মানগুলি RGB, Hex, CMYK, এবং HSV জুড়ে পরিবর্তিত হয়। লক্ষ্য করুন যে শুদ্ধ লাল (RGB 255, 0, 0) `#FF0000`-এর সমান, কিন্তु তার CMYK সমতুল্য হল 0, 100, 100, 0—সম্পূর্ণ ভিন্ন সংখ্যা যা একই অনুভূত রঙকে উপস্থাপন করে। এই দৃশ্য প্রতিক্রিয়া ছাত্রদের বুঝতে সাহায্য করে যে কেন RGB যোগাত্মক মিশ্রণ (আলোর সংযোজন) ব্যবহার করে যেখানে CMYK বিয়োজাত্মক মিশ্রণ (মুদ্রণ রঙের সংযোজন) ব্যবহার করে। ইন্টারেক্টিভ প্রকৃতি বিমূর্ত ধারণাগুলিকে স্পর্শযোগ্য করে তোলে। ## আপনি যে রঙ টুলগুলি প্রয়োজন করতে পারেন এই টুলটি পৃথক রঙ নির্বাচন এবং রূপান্তর করার উপর দৃষ্টি নিবদ্ধ করে। আপনার প্রকল্পের উপর নির্ভর করে, আপনার আরও প্রয়োজন হতে পারে: **প্যালেট জেনারেটর** (Adobe Color, Coolors) যখন আপনার রঙ তত্ত্বের উপর ভিত্তি করে একাধিক সুসংগত রঙ প্রয়োজন—পরস্পর পূরক, ত্রিভুজাকার, বা সাদৃশ্যপূর্ণ স্কিম। **ব্রাউজার এক্সটেনশন** (ColorZilla, Eye Dropper) যে কোনো ওয়েবপৃষ্ঠা বা স্ক্রিন উপাদান থেকে সরাসরি রঙ বের করতে। বিদ্যমান ডিজাইন মিলাতে দুর্দান্ত। **কনট্রাস্ট পরীক্ষক** অ্যাক্সেসিবিলিটি কাজের জন্য। [WebAIM কনট্রাস্ট পরীক্ষক](https://webaim.org/resources/contrastchecker/) পরীক্ষা করে আপনার টেক্সট/ব্যাকগ্রাউন্ড সংমিশ্রণ WCAG মানদণ্ড পূরণ করে কিনা। **পান্টোন/RAL সিস্টেম** বিভিন্ন মুদ্রণ দোকান এবং উপাদানে সঠিক মুদ্রণ রঙ মিলাতে। এই শারীরিক সোয়াচবুকগুলি ডিজিটাল টুলগুলি যা সঠিকভাবে অনুলিপি করতে পারে না তার জন্য মানসম্মত রেফারেন্স সরবরাহ করে। ## রঙ সুলভ করা প্রায় ৮% পুরুষ এবং ০.৫% মহিলার রঙ দৃষ্টি দুর্বলতার কিছু ধরন রয়েছে। এখানে কীভাবে অন্তর্ভুক্তিমূলক ডিজাইন করতে হয়: **কখনই শুধুমাত্র রঙ ব্যবহার করবেন না** অর্থ প্রকাশ করতে। যদি আপনার ফর্ম লাল রঙে ত্রুটি দেখায়, তাহলে একটি আইকন বা টেক্সট লেবেলও যোগ করুন। বিভিন্ন রঙের লাইন সহ চার্ট? প্যাটার্ন, লেবেল, বা উভয়ই যোগ করুন। **কনট্রাস্ট অনুপাত পরীক্ষা করুন** [WebAIM কনট্রাস্ট চেকার](https://webaim.org/resources/contrastchecker/) এর মতো টুলগুলি ব্যবহার করে। সাধারণ টেক্সটের জন্য তার পটভূমির বিপরীতে ন্যূনতম ৪.৫:১ অনুপাত প্রয়োজন, বড় টেক্সটের জন্য ৩:১। [WCAG ২.১ নির্দেশিকা](https://www.w3.org/WAI/WCAG21/Understanding/contrast-minimum.html) অনুসারে, এটি মধ্যম দৃষ্টি দুর্বল ব্যবহারকারীদের পঠনযোগ্যতা নিশ্চিত করে। **সমস্যাজনক সংমিশ্রণ এড়িয়ে চলুন:** লাল-সবুজ সবচেয়ে সাধারণ সমস্যা (প্রোটানোপিয়া এবং ডিউটেরানোপিয়া লাল এবং সবুজ অনুভবে প্রভাব ফেলে)। নীল-হলুদ ট্রিটানোপিয়া থাকা লোকদের জন্য সমস্যা সৃষ্টি করে। [Coblis](https://www.color-blindness.com/coblis-color-blindness-simulator/) এর মতো সিমুলেটরগুলি দিয়ে আপনার ডিজাইনগুলি পরীক্ষা করুন যাতে দেখতে পারেন তা বিভিন্ন রঙ দৃষ্টি দুর্বলতা সম্পন্ন ব্যবহারকারীদের কাছে কীভাবে দেখায়। **যখন সম্ভব রঙ-অন্ধ-বন্ধু প্যালেট ব্যবহার করুন**। নীল, কমলা এবং হলুদ সাধারণত একসঙ্গে ভাল কাজ করে কারণ সবচেয়ে বেশি রঙ অন্ধতার ধরনে তারা পৃথক পরিলক্ষিত হয়। ## প্রায়শ জিজ্ঞাসিত প্রশ্নাবলী ### RGB এবং CMYK-এর মধ্যে পার্থক্য কী? RGB স্ক্রিনের জন্য, CMYK মুদ্রণের জন্য। স্ক্রিনগুলি লাল, সবুজ এবং নীল আলোর নিঃসরণ দ্বারা রঙ তৈরি করে (যোগাত্মক মিশ্রণ), যেখানে মুদ্রক সাইয়ান, ম্যাজেন্টা, হলুদ এবং কালো মুদ্রণ রঙের পরতগুলি কাগজে সংযোজন করে রঙ তৈরি করে (বিয়োগাত্মক মিশ্রণ)। RGB আলোর বিস্তৃত রঙ পরিসরের কারণে CMYK-এর চেয়ে উজ্জ্বল এবং জৌলুস রঙ উৎপন্ন করতে পারে। এই কারণে আপনার স্ক্রিনের রঙগুলি প্রায়শই মুদ্রিত হলে কম উজ্জ্বল দেখায়। ### আমার রঙগুলি মুদ্রিত হলে কেন আলাদা দেখায়? স্ক্রিনগুলি আলো নিঃসরণ করে, কাগজ তা প্রতিফলিত করে—মৌলিকভাবে আলাদা প্রক্রিয়া। উপরন্তু, RGB লক্ষ লক্ষ রঙ পরিচালনা করে যা CMYK মুদ্রণ রঙ সম্পূর্ণরূপে পুনরুৎপাদন করতে পারে না। স্ক্রিন ক্যালিব্রেশন, কাগজের গুণমান এবং মুদ্রণ রঙের পার্থক্য আরও বৈচিত্র্য যোগ করে। সর্বদা মুদ্রণের আগে CMYK মানগুলি পরীক্ষা করুন এবং গুরুত্বপূর্ণ রঙ মিলের কাজের জন্য শারীরিক প্রুফ অনুরোধ করুন। ### আমি অনলাইনে দেখা রঙগুলি থেকে হেক্স কোড কীভাবে পাব? আপনার ব্রাউজারের ডেভেলপার টুলস ব্যবহার করুন। Chrome বা Firefox-এ, যেকোনো উপাদানে ডান ক্লিক করুন, "Inspect" নির্বাচন করুন, তারপর স্টাইল প্যানেলে ছোট রঙের বর্গে ক্লিক করুন। এটি একটি রঙ পিকার খুলে যা হেক্স কোড দেখায়। ColorZilla মত ব্রাউজার এক্সটেনশনগুলি এটিকে আরও দ্রুত করে—যেখানে আপনি পৃষ্ঠায় ক্লিক করে তার রঙ মান পেতে পারেন। ### হেক্স কোডে # চিহ্নের অর্থ কী? এটি শুধুমাত্র একটি উপসর্গ যা ব্রাউজারকে বলে "এটি একটি হেক্সাডেসিমাল রঙ কোড"। এই মান প্রাথমিক HTML এবং CSS বিনির্দেশ থেকে এসেছে। `#`-এর পরের ছয় অক্ষর RGB মানগুলি বেস-১৬-এ প্রতিনিধিত্ব করে: লাল জন্য দুই অঙ্ক, সবুজ জন্য দুই অঙ্ক, নীল জন্য দুই অঙ্ক। `#` ছাড়া, ব্রাউজাররা এটিকে রঙ হিসাবে চিনতে পারবে না। ### ৩-অঙ্কের হেক্স কোডগুলি কেন কাজ করে? এগুলি তখন ব্যবহৃত হয় যখন প্রত্যেক রঙ চ্যানেল পুনরাবৃত্তি হয়। `#F00` বিস্তৃত হয় `#FF0000` (লাল), `#C9C` হয় `#CC99CC` (হালকা বেগুনি)। এই সংক্ষিপ্ত রূপটি ১৯৯০-এর দশকে ব্যান্ডউইডথ ব্যয়বহুল থাকার সময় ফাইলের আকার কমাতে তৈরি করা হয়েছিল। সহজ রঙের জন্য এটি আজও সুবিধাজনক। ### রঙ রূপান্তরগুলি কি সঠিক? RGB-থেকে-হেক্স রূপান্তরগুলি গাণিতিকভাবে সঠিক—এগুলি বিভিন্ন সংখ্যা পদ্ধতিতে একই মান। RGB-থেকে-CMYK রূপান্তরগুলি আনুমানিক কারণ আপনি মৌলিকভাবে আলাদা রঙ পরিসরের (আলো বনাম মুদ্রণ রঙ) মধ্যে রূপান্তর করছেন। টুলটি [ICC রঙ প্রোফাইল মানদণ্ড](http://www.color.org/specification/ICC1v42_2006-05.pdf) ব্যবহার করে যা পেশাদার ডিজাইন সফটওয়্যার ব্যবহার করে। ### কীভাবে সুলভ রঙ সংমিশ্রণ তৈরি করব? রঙ নির্বাচনের পর [WebAIM-এর টুল](https://webaim.org/resources/contrastchecker/) ব্যবহার করে কনট্রাস্ট পরীক্ষা করুন। সাধারণ টেক্সটের জন্য ৪.৫:১ অনুপাত, বড় টেক্সটের জন্য ৩:১ প্রয়োজন। লাল-সবুজ সংমিশ্রণ এড়িয়ে চলুন (রঙান্ধ ব্যবহারকারীদের জন্য সবচেয়ে কঠিন)। যদি সন্দেহ থাকে, তাহলে গাঢ় টেক্সট হালকা পটভূমিতে বা তার বিপরীতে—পর্যাপ্ত আলোর পার্থক্যই সবচেয়ে গুরুত্বপূর্ণ। ### কি আমি ছবি থেকে রঙ নিতে পারি? সরাসরি এই টুলে নয়। ColorZilla মত ব্রাউজার এক্সটেনশন ব্যবহার করুন, বা ছবির স্ক্রিনশট নিন এবং আপনার অপারেটিং সিস্টেমের রঙ পিকার ব্যবহার করুন (macOS-এ ডিজিটাল কালার মিটার, Windows-এ PowerToys কালার পিকার)। যখন আপনি রঙ মান পাবেন, তখন এখানে প্রবেশ করে ফরম্যাটের মধ্যে রূপান্তর করুন। ### কেন কিছু RGB রঙ CMYK-তে ভাল রূপান্তর হয় না? CMYK-এর "গ্যামুট" (পুনরুৎপাদনযোগ্য রঙের পরিসর) RGB-এর চেয়ে সংকীর্ণ। উজ্জ্বল নীল, জৌলুস সবুজ এবং বিদ্যুৎ কমলা প্রায়শই CMYK মুদ্রণ রঙ দ্বারা সম্পূর্ণরূপে তৈরি করা যায় না। এই ক্ষেত্রে, মুদ্রক সম্ভাব্য সবচেয়ে কাছাকাছি রঙটি বদলে দেয়, যা সাধারণত কম তীব্রতার দেখায়। পেশাদার মুদ্রণ ডিজাইনাররা এই সমস্যা এড়াতে প্রায়শই CMYK-সুরক্ষিত রঙ দিয়ে শুরু করেন। ## রঙ রূপান্তরের জন্য কোড উদাহরণ এখানে বিভিন্ন রঙ ফর্ম্যাটের মধ্যে রূপান্তরের কিছু কোড উদাহরণ রয়েছে:1// RGB থেকে Hex রূপান্তর
2function rgbToHex(r, g, b) {
3 const toHex = (c) => {
4 const hex = Math.round(c).toString(16);
5 return hex.length === 1 ? '0' + hex : hex;
6 };
7
8 return `#${toHex(r)}${toHex(g)}${toHex(b)}`;
9}
10
11// Hex থেকে RGB রূপান্তর
12function hexToRgb(hex) {
13 // # থাকলে সরিয়ে দিন
14 const cleanHex = hex.startsWith('#') ? hex.slice(1) : hex;
15
16 // 3-ডিজিট এবং 6-ডিজিট hex হ্যান্ডেল করুন
17 const expandedHex = cleanHex.length === 3
18 ? cleanHex.split('').map(char => char + char).join('')
19 : cleanHex;
20
21 const r = parseInt(expandedHex.substring(0, 2), 16);
22 const g = parseInt(expandedHex.substring(2, 4), 16);
23 const b = parseInt(expandedHex.substring(4, 6), 16);
24
25 return { r, g, b };
26}
27
28// RGB থেকে CMYK রূপান্তর
29function rgbToCmyk(r, g, b) {
30 // RGB মানগুলি নরমালাইজ করুন
31 const normalizedR = r / 255;
32 const normalizedG = g / 255;
33 const normalizedB = b / 255;
34
35 // K (কালো) গণনা করুন
36 const k = 1 - Math.max(normalizedR, normalizedG, normalizedB);
37
38 // পুরো কালো হ্যান্ডেল করুন
39 if (k === 1) {
40 return { c: 0, m: 0, y: 0, k: 100 };
41 }
42
43 // C, M, Y গণনা করুন
44 const c = ((1 - normalizedR - k) / (1 - k)) * 100;
45 const m = ((1 - normalizedG - k) / (1 - k)) * 100;
46 const y = ((1 - normalizedB - k) / (1 - k)) * 100;
47
48 return {
49 c: Math.round(c),
50 m: Math.round(m),
51 y: Math.round(y),
52 k: Math.round(k * 100)
53 };
54}
55
56// ব্যবহারের উদাহরণ
57const rgb = { r: 255, g: 0, b: 0 }; // পুরো লাল
58console.log(`Hex: ${rgbToHex(rgb.r, rgb.g, rgb.b)}`);
59console.log(`CMYK:`, rgbToCmyk(rgb.r, rgb.g, rgb.b));
601# RGB থেকে Hex রূপান্তর
2def rgb_to_hex(r, g, b):
3 return f'#{r:02x}{g:02x}{b:02x}'
4
5# Hex থেকে RGB রূপান্তর
6def hex_to_rgb(hex_color):
7 # # থাকলে সরিয়ে দিন
8 hex_color = hex_color.lstrip('#')
9
10 # 3-ডিজিট এবং 6-ডিজিট hex হ্যান্ডেল করুন
11 if len(hex_color) == 3:
12 hex_color = ''.join([c*2 for c in hex_color])
13
14 return {
15 'r': int(hex_color[0:2], 16),
16 'g': int(hex_color[2:4], 16),
17 'b': int(hex_color[4:6], 16)
18 }
19
20# RGB থেকে CMYK রূপান্তর
21def rgb_to_cmyk(r, g, b):
22 # RGB মানগুলি নরমালাইজ করুন
23 r_norm = r / 255
24 g_norm = g / 255
25 b_norm = b / 255
26
27 # K (কালো) গণনা করুন
28 k = 1 - max(r_norm, g_norm, b_norm)
29
30 # পুরো কালো হ্যান্ডেল করুন
31 if k == 1:
32 return {'c': 0, 'm': 0, 'y': 0, 'k': 100}
33
34 # C, M, Y গণনা করুন
35 c = ((1 - r_norm - k) / (1 - k)) * 100
36 m = ((1 - g_norm - k) / (1 - k)) * 100
37 y = ((1 - b_norm - k) / (1 - k)) * 100
38
39 return {
40 'c': round(c),
41 'm': round(m),
42 'y': round(y),
43 'k': round(k * 100)
44 }
45
46# ব্যবহারের উদাহরণ
47rgb = {'r': 0, 'g': 128, 'b': 255} # আকাশি নীল
48hex_color = rgb_to_hex(rgb['r'], rgb['g'], rgb['b'])
49cmyk = rgb_to_cmyk(rgb['r'], rgb['g'], rgb['b'])
50
51print(f"Hex: {hex_color}")
52print(f"CMYK: C={cmyk['c']}%, M={cmyk['m']}%, Y={cmyk['y']}%, K={cmyk['k']}%")
531public class ColorConverter {
2 // RGB থেকে Hex রূপান্তর
3 public static String rgbToHex(int r, int g, int b) {
4 return String.format("#%02x%02x%02x", r, g, b);
5 }
6
7 // Hex থেকে RGB রূপান্তর
8 public static int[] hexToRgb(String hexColor) {
9 // # থাকলে সরিয়ে দিন
10 if (hexColor.startsWith("#")) {
11 hexColor = hexColor.substring(1);
12 }
13
14 // 3-ডিজিট এবং 6-ডিজিট hex হ্যান্ডেল করুন
15 if (hexColor.length() == 3) {
16 String expandedHex = "";
17 for (char c : hexColor.toCharArray()) {
18 expandedHex += c + String.valueOf(c);
19 }
20 hexColor = expandedHex;
21 }
22
23 int r = Integer.parseInt(hexColor.substring(0, 2), 16);
24 int g = Integer.parseInt(hexColor.substring(2, 4), 16);
25 int b = Integer.parseInt(hexColor.substring(4, 6), 16);
26
27 return new int[]{r, g, b};
28 }
29
30 // RGB থেকে CMYK রূপান্তর
31 public static double[] rgbToCmyk(int r, int g, int b) {
32 // RGB মানগুলি নরমালাইজ করুন
33 double normalizedR = r / 255.0;
34 double normalizedG = g / 255.0;
35 double normalizedB = b / 255.0;
36
37 // K (কালো) গণনা করুন
38 double k = 1 - Math.max(Math.max(normalizedR, normalizedG), normalizedB);
39
40 // পুরো কালো হ্যান্ডেল করুন
41 if (k == 1) {
42 return new double[]{0, 0, 0, 100};
43 }
44
45 // C, M, Y গণনা করুন
46 double c = ((1 - normalizedR - k) / (1 - k)) * 100;
47 double m = ((1 - normalizedG - k) / (1 - k)) * 100;
48 double y = ((1 - normalizedB - k) / (1 - k)) * 100;
49
50 return new double[]{
51 Math.round(c),
52 Math.round(m),
53 Math.round(y),
54 Math.round(k * 100)
55 };
56 }
57
58 public static void main(String[] args) {
59 // ব্যবহারের উদাহরণ
60 int r = 75, g = 0, b = 130; // বেগুনি
61 String hexColor = rgbToHex(r, g, b);
62 double[] cmyk = rgbToCmyk(r, g, b);
63
64 System.out.println("Hex: " + hexColor);
65 System.out.printf("CMYK: C=%.0f%%, M=%.0f%%, Y=%.0f%%, K=%.0f%%\n",
66 cmyk[0], cmyk[1], cmyk[2], cmyk[3]);
67 }
68}
69রেফারেন্স এবং আরও পড়ার জন্য
- W3C CSS রঙ মডিউল লেভেল ৪ - অফিসিয়াল ওয়েব রঙ বিশিষ্টতা
- WCAG ২.১ কনট্রাস্ট গাইডলাইন - রঙ কনট্রাস্ট এর জন্য অ্যাক্সেসিবিলিটি মান
- WebAIM কনট্রাস্ট চেকার - রঙ কনট্রাস্ট অনুপাত পরীক্ষা করুন
- ICC রঙ প্রোফাইল মান - রঙ রূপান্তরের জন্য কাঠামো
- MDN ওয়েব ডকুমেন্টস: CSS রঙ মান - ওয়েব রঙ ফর্ম্যাটের সম্পূর্ণ গাইড