অ্যাক্সেসিবিলিটি ও WCAG কনট্রাস্ট ইন্সপেকশন
লাইভ ইন্টারঅ্যাক্টিভ UI মকআপ প্রিভিউ
কালার ব্লাইন্ডনেস সিমুলেটর ইঞ্জিন
ফিচারগুলো কীভাবে কাজ করে
WCAG কনট্রাস্ট ভেরিফিকেশন
ওয়েব অ্যাক্সেসিবিলিটির জন্য লাইভ কনট্রাস্ট রেশিও স্কোর প্রদর্শনী।
ইন্টারঅ্যাক্টিভ UI মকআপ
ওয়েবসাইট ও মোবাইল অ্যাপ উপাদানে কালার ম্যাপিং প্রিভিউ।
কালার ব্লাইন্ডনেস সিমুলেটর
Protanopia, Deuteranopia, ও Tritanopia ফিল্টার টেস্ট।
৬০-৩০-১০ ডিজাইন ব্যালেন্স
ডমিন্যান্ট, সেকেন্ডারি ও অ্যাকসেন্ট কালার পার্সেন্টেজ ব্রেকডাউন।
ইমেজ থেকে কালার এক্সট্র্যাক্ট
ছবি আপলোড করে মূল সোলিড কালার সোয়াচ তৈরির অপশন।
ডেভেলপার টোকেন এক্সপোর্ট
CSS, Tailwind JS, Figma JSON, Flutter Dart, ও SwiftUI কোড ডাউনলোড।
কী কী কাজে ব্যবহার করা যায়?
ফ্রন্টএন্ড ওয়েব ইঞ্জিনিয়ারিং
অ্যাক্সেসিবিলিটি পাস করা CSS ও Tailwind থিম টোকেন তৈরি।
মোবাইল অ্যাপ প্রোটোটাইপিং
Flutter ও SwiftUI-র জন্য ক্লিয়ার ডিজাইন সিস্টেম তৈরি।
ব্র্যান্ড আইডেন্টিটি সিস্টেম
ছবি বা লোগো থেকে ব্র্যান্ড সোলিড কালার এক্সট্র্যাক্ট।
UI/UX অ্যাক্সেসিবিলিটি অডিট
সহজে পাঠযোগ্য ইনক্লুসিভ ডিজাইন ভেরিফিকেশন।
টুলের বিস্তারিত তথ্য
| টুলের ধরন | সোলিড কালার প্যালেট ও অ্যাক্সেসিবিলিটি জেনারেটর |
|---|---|
| অ্যাক্সেসিবিলিটি স্ট্যান্ডার্ড | WCAG 2.1 AA & AAA Compliance |
| সিমুলেশন মোড | Protanopia, Deuteranopia, Tritanopia |
| এক্সপোর্ট ফরম্যাট | CSS, Tailwind JS, Figma JSON, Flutter, SwiftUI |
| প্রসেসিং | ১০০% ক্লায়েন্ট-সাইড ইন-ব্রাউজারExecution |
সুবিধা
- কোনো রেজিস্ট্রেশন লাগবে না।
- এক ক্লিকেই HEX কোড কপি।
- লাইভ রিয়েল-টাইম UI মকআপ দেখার সুবিধা।
- কালার ব্লাইন্ডনেস ভিউ সাপোর্ট।
সীমাবদ্ধতা
- ইমেজ থেকে কালার এক্সট্র্যাক্ট করার সময় sRGB পিক্সেল স্যাম্পলিং ব্যবহৃত হয়।
সম্পূর্ণ ক্লায়েন্ট-সাইড সিকিউরিটি
সকল ফাইল তৈরি ও কনট্রাস্ট হিসেব সরাসরি আপনার ব্রাউজারেই সম্পন্ন হয়।
জিরো ডাটা স্টোরেজ
আপলোড করা ছবি বা প্যালেট আমাদের সার্ভারে সংরক্ষিত হয় না।
টিপস
- আপনার বাটন ও টেক্সট কালারের কনট্রাস্ট রেশিও অন্তত ৪.৫:১ রাখার চেষ্টা করুন।
সাধারণ প্রশ্ন ও উত্তর
WCAG কনট্রাস্ট রেশিও বলতে কী বোঝায়?
WCAG কনট্রাস্ট রেশিও দিয়ে টেক্সট ও ব্যাকগ্রাউন্ডের পাঠযোগ্যতা মাপা হয়। সাধারণ টেক্সটের জন্য ন্যূনতম ৪.৫:১ রেশিও প্রয়োজন।
কালার ব্লাইন্ডনেস সিমুলেটর কীভাবে কাজ করে?
এটি SVG ফিল্টার ব্যবহার করে Protanopia, Deuteranopia ও Tritanopia দৃষ্টিসীমার লাইভ প্রিভিউ প্রদান করে।
ছবি থেকে কি সোলিড কালার তৈরি করা সম্ভব?
হ্যাঁ, Extract from Photo বাটনে ক্লিক করে ছবি আপলোড করলেই মূল সোলিড কালারগুলো তৈরি হয়ে যাবে।
৬০-৩০-১০ ডিজাইন রুল কী?
এটি একটি ব্যালেন্সড UI রুল: ৬০% মূল ব্যাকগ্রাউন্ড, ৩০% সেকেন্ডারি কার্ড/বক্স, এবং ১০% প্রাইমারি বাটন কালার।
টুলটি কি Figma ডিজাইন টোকেন এক্সপোর্ট করে?
হ্যাঁ, এটি সরাসরি Figma JSON টোকেন ফাইল প্রদান করে।
Flutter কোড কি প্রোডাকশন রেডি?
হ্যাঁ, এটি একটি রেডি-টু-ইউজ AppColors Dart ক্লাস তৈরি করে দেয়।
Shades এবং Triadic-এর মধ্যে পার্থক্য কী?
Shades হলো একই রঙের হালকা ও গাঢ় রূপ, আর Triadic হলো কালার হুইলের ৩টি সমদূরত্বে থাকা রঙ।
আমার আপলোড করা ছবি কি সার্ভারে সেভ হবে?
না, ছবি সংক্রান্ত প্রসেসিং সম্পূর্ণভাবে আপনার ব্রাউজার মেমোরিতে ঘটে।
প্যালেটের কালারগুলোর অবস্থান কি অদলবদল করা যায়?
হ্যাঁ, Shuffle বাটনে চাপ দিলেই কালারের পজিশন পরিবর্তন হয়ে যাবে।
এই সোলিড কালার জেনারেটর কি সম্পূর্ণ ফ্রি?
হ্যাঁ, সকল ফিচার এবং কোড এক্সপোর্ট সুবিধা ১০০% ফ্রি।