কালার পিকার ও কনট্রাস্ট চেকার
পিকার দিয়ে রং বেছে নিন বা যেকোনো ফরম্যাটে লিখুন। সেটি HEX, RGB, HSL, HSV ও CMYK-তে দেখুন, হালকা ও গাঢ় শেড আর মানানসই রং পান, এবং দেখুন দুই রঙের লেখা অ্যাক্সেসিবিলিটির জন্য WCAG কনট্রাস্ট নির্দেশিকা মানে কি না।
রং
কালার পিকার ও কনট্রাস্ট চেকার সম্পর্কে
পিকার দিয়ে রং বেছে নিন বা যেকোনো ফরম্যাটে লিখুন। সেটি HEX, RGB, HSL, HSV ও CMYK-তে দেখুন, হালকা ও গাঢ় শেড আর মানানসই রং পান, এবং দেখুন দুই রঙের লেখা অ্যাক্সেসিবিলিটির জন্য WCAG কনট্রাস্ট নির্দেশিকা মানে কি না।
SmartCalcy-র “ফাইল, ছবি ও ডিজাইন” বিভাগের অংশ। এটি অ্যাকাউন্ট ছাড়াই আপনার ব্রাউজারে চলে, আপনার নিজের মুদ্রা ও একক ব্যবহার করে (পেজের উপরে বদলান), এবং শুধু তথ্যের জন্য অনুমান দেয়, তাই কোনো ফলাফলের ওপর নির্ভর করার আগে সরকারি নির্দেশনা দেখে নিন।
কালার পিকার ও কনট্রাস্ট চেকার কীভাবে ব্যবহার করবেন
এটি কী হিসাব করে এবং কখন ব্যবহার করবেন
রং বেছে নিয়ে HEX, RGB, HSL, HSV ও CMYK-এর মধ্যে কনভার্ট করে, হালকা-গাঢ় শেড ও মানানসই রং সাজেস্ট করে, এবং WCAG অ্যাক্সেসিবিলিটি নির্দেশিকা অনুযায়ী লেখার কনট্রাস্ট যাচাই করে।
ধাপে ধাপে ব্যবহারের নিয়ম
- পিকার দিয়ে রং বেছে নিন বা HEX, RGB, HSL অথবা রঙের নাম হিসেবে লিখুন।
- কনট্রাস্ট যাচাই করতে ব্যাকগ্রাউন্ডের রং বেছে নিন।
- এক ক্লিকে যেকোনো ফরম্যাট কপি করুন।
- প্যালেটের জন্য হালকা-গাঢ় শেড ও মানানসই রং ব্যবহার করুন।
প্রতিটি ইনপুটের অর্থ
- রং – শুরুতে #2443C8, অর্থাৎ SmartCalcy নীল।
- ব্যাকগ্রাউন্ড – শুরুতে সাদা।
ফলাফল কীভাবে পড়বেন
- কনট্রাস্ট অনুপাত – 1:1 থেকে 21:1 পর্যন্ত, সাধারণ ও বড় লেখার জন্য AA ও AAA ফলাফলসহ।
- ফরম্যাট – HEX, RGB, HSL, HSV ও CMYK।
- হালকা ও গাঢ় শেড – হালকা ও গাঢ় রূপ।
- মানানসই রং – পরিপূরক, সদৃশ (অ্যানালগাস) ও ত্রয়ী (ট্রায়াডিক)।
সূত্র
কনট্রাস্ট অনুপাত = (L1 + 0.05) ÷ (L2 + 0.05), যেখানে L1 ও L2 হলো হালকা ও গাঢ় রঙের আপেক্ষিক উজ্জ্বলতা (লুমিন্যান্স)। WCAG AA-র জন্য সাধারণ লেখায় 4.5:1 ও বড় লেখায় 3:1 লাগে; AAA-র জন্য 7:1 ও 4.5:1।
একটি সমাধান করা উদাহরণ
শুরুর রঙে, সাদার উপর #2443C8-এর কনট্রাস্ট অনুপাত 7.74:1, যা সব লেখার আকারে AAA পাস করে।
অনুমান ও সীমাবদ্ধতা
- CMYK মান একটি সাধারণ রূপান্তর, কালার-ম্যানেজড প্রিন্ট প্রোফাইল নয়।
- কনট্রাস্টের ফলাফল WCAG 2 সূত্র অনুযায়ী।
সাধারণ ভুল
- শুধু বড় লেখায় কনট্রাস্ট যাচাই করে সেই রং ছোট লেখায় ব্যবহার করা।
- অর্থ বোঝাতে শুধু রঙের উপর নির্ভর করা।
সচরাচর জিজ্ঞাসিত প্রশ্ন
আমার কত কনট্রাস্ট অনুপাত দরকার?
WCAG AA পূরণ করতে সাধারণ লেখায় অন্তত 4.5:1 ও বড় লেখায় 3:1।
বড় লেখা কি কোনো নির্দিষ্ট মাপ?
হ্যাঁ: অন্তত 24 px, বা বোল্ডে প্রায় 18.7 px।
আমি কি রঙের নাম লিখতে পারি?
হ্যাঁ, teal বা tomato-র মতো যেকোনো CSS রঙের নাম চলবে।
সম্পর্কিত টুল
| লেভেল | সাধারণ লেখা | বড় লেখা |
|---|---|---|
| AA | পাস | পাস |
| AAA | পাস | পাস |
ফরম্যাট
- HEX
- RGB
- HSL
- HSV
- CMYK