আপনি HEX ফরম্যাটে নিখুঁত রঙ পেলেন, কিন্তু ব্যবহৃত ডিজাইন টুলে RGB লাগবে। অথবা ক্লায়েন্ট RGB-তে রঙ পাঠিয়েছে এবং আপনার CSS-এর জন্য HSL মান দরকার। কালার ফরম্যাট রূপান্তর ডিজাইনার ও ডেভেলপারদের দৈনন্দিন কাজ। আমাদের কালার কনভার্টার এটি তাৎক্ষণিক করে।
যা প্রয়োজন
- যেকোনো ফরম্যাটে একটি কালার ভ্যালু (HEX, RGB, HSL, বা অন্যান্য)
- একটি ওয়েব ব্রাউজার (Chrome, Firefox, Safari, বা Edge)
- কোনো অ্যাকাউন্ট বা ইনস্টলেশন লাগবে না
ধাপে ধাপে গাইড
আপনার কালার ভ্যালু লিখুন
কালার কনভার্টার টুল খুলুন। যেকোনো সমর্থিত ফরম্যাটে আপনার কালার ভ্যালু টাইপ বা পেস্ট করুন। উদাহরণস্বরূপ, HEX ভ্যালু হিসেবে #3B82F6, RGB হিসেবে rgb(59, 130, 246), বা HSL হিসেবে hsl(217, 91%, 60%) লিখুন। টুলটি স্বয়ংক্রিয়ভাবে ফরম্যাট চিনে নেয়।
সমস্ত ফরম্যাট রূপান্তর দেখুন
টুলটি তাৎক্ষণিকভাবে প্রতিটি সমর্থিত ফরম্যাটে আপনার রঙ প্রদর্শন করে: HEX, RGB, HSL এবং আরও অনেক। সমস্ত সমতুল্য মানের পাশাপাশি রঙের লাইভ প্রিভিউ দেখতে পারেন। রঙ সামঞ্জস্য করতে হলে, কালার পিকার ব্যবহার করে দৃশ্যত ফাইন-টিউন করুন।
প্রয়োজনীয় ফরম্যাট কপি করুন
যেকোনো ফরম্যাটের পাশে কপি বাটনে ক্লিক করে ক্লিপবোর্ডে কপি করুন। সরাসরি CSS ফাইল, ডিজাইন টুল বা যেখানে প্রয়োজন সেখানে পেস্ট করুন। ম্যানুয়াল রিটাইপিং লাগবে না।
জেনে রাখুন কালার কনভার্টার সম্পূর্ণরূপে আপনার ব্রাউজারে চলে। লোড হওয়ার পর অফলাইনে কাজ করে এবং কোনো অ্যাকাউন্ট বা ইনস্টলেশন লাগে না।
কালার ফরম্যাট বোঝা
বিভিন্ন টুল ও প্রসঙ্গে বিভিন্ন কালার ফরম্যাট ব্যবহৃত হয়। কখন কোনটি ব্যবহার করবেন:
HEX
ওয়েবে সবচেয়ে সাধারণ ফরম্যাট। HEX কালার # দিয়ে শুরু হয় এবং ছয়টি অক্ষর (অক্ষর ও সংখ্যা) থাকে, যেমন #FF5733।
- ব্যবহৃত: CSS, HTML, ডিজাইন টুল (Figma, Sketch, Photoshop)
- ফরম্যাট:
#RRGGBBযেখানে প্রতিটি জোড়া 00 থেকে FF পর্যন্ত হেক্সাডেসিমাল মান - উদাহরণ:
#3B82F6(একটি মাঝারি নীল)
RGB
লাল, সবুজ এবং নীল উপাদান ব্যবহার করে রঙ বর্ণনা করে, প্রতিটি 0 থেকে 255 পর্যন্ত।
- ব্যবহৃত: CSS (
rgb()ফাংশন), প্রোগ্রামিং ভাষা, LED আলো - ফরম্যাট:
rgb(red, green, blue) - উদাহরণ:
rgb(59, 130, 246)
HSL
হিউ (0-360 ডিগ্রি কালার হুইলে), স্যাচুরেশন (0-100%) এবং লাইটনেস (0-100%) ব্যবহার করে রঙ বর্ণনা করে।
- ব্যবহৃত: CSS (
hsl()ফাংশন), কালার থিওরি, ডিজাইন সিস্টেম - ফরম্যাট:
hsl(hue, saturation%, lightness%) - উদাহরণ:
hsl(217, 91%, 60%)
পরামর্শ HSL রঙ সামঞ্জস্য করার জন্য সবচেয়ে স্বজ্ঞাত ফরম্যাট। হালকা শেড চান? লাইটনেস মান বাড়ান। আরও নিস্তেজ টোন চান? স্যাচুরেশন কমান। এটি কালার সিস্টেম তৈরি এবং বেস কালারের বিভিন্নতা তৈরির জন্য HSL আদর্শ করে।
কখন কোন ফরম্যাট ব্যবহার করবেন
| পরিস্থিতি | প্রস্তাবিত ফরম্যাট |
|---|---|
| হাতে CSS লেখা | HEX (সংক্ষিপ্ত ও পরিচিত) বা HSL (টুইক করা সহজ) |
| ডিজাইন টুল স্পেসিফিকেশন | HEX (ইন্ডাস্ট্রি স্ট্যান্ডার্ড) |
| কোডে ডায়নামিক কালার ম্যানিপুলেশন | HSL (প্রোগ্রাম্যাটিকভাবে সামঞ্জস্য করা সবচেয়ে সহজ) |
| ক্লায়েন্টকে রঙ জানানো | HEX (সর্বজনীনভাবে স্বীকৃত) |
| প্রিন্ট ডিজাইন | CMYK (স্ক্রিন ফরম্যাট থেকে আলাদা) |
একক রঙের বাইরে
রঙ রূপান্তরের পর, সম্পর্কিত টুল অন্বেষণ করতে পারেন:
- গ্রেডিয়েন্ট জেনারেটর: আপনার রঙ ব্যবহার করে মসৃণ CSS গ্রেডিয়েন্ট তৈরি করুন। দুটি বা তার বেশি রঙ দিন এবং স্টাইলশিটে পেস্ট করার জন্য প্রস্তুত গ্রেডিয়েন্ট কোড পান।
- কালার প্যালেট জেনারেটর: আপনার শুরুর রঙের উপর ভিত্তি করে সুসংগত কালার প্যালেট তৈরি করুন। স্বয়ংক্রিয়ভাবে কমপ্লিমেন্টারি, অ্যানালগাস, ট্রায়াডিক এবং অন্যান্য কালার স্কিম পান।
এই টুলগুলো কালার কনভার্টারের সাথে হাতে হাত মিলিয়ে কাজ করে আপনার প্রজেক্টের জন্য সম্পূর্ণ কালার সিস্টেম তৈরি করতে।
গুরুত্বপূর্ণ ডিসপ্লে ক্যালিব্রেশন, কালার প্রোফাইল এবং ব্রাইটনেস সেটিংসের কারণে ভিন্ন স্ক্রিনে রঙ ভিন্ন দেখতে পারে। রঙের নির্ভুলতা গুরুত্বপূর্ণ হলে (ব্র্যান্ডিং, প্রিন্ট ডিজাইন), সর্বদা লক্ষ্য মাধ্যমে আপনার রঙ যাচাই করুন, শুধু স্ক্রিনে নয়।
প্রায়শই জিজ্ঞাসিত প্রশ্ন
HEX এবং RGB-এর মধ্যে পার্থক্য কী?
তারা ভিন্ন নোটেশনে একই তথ্য প্রকাশ করে। HEX হেক্সাডেসিমাল (বেস-16) এবং RGB দশমিক (বেস-10) ব্যবহার করে। #FF0000 এবং rgb(255, 0, 0) দুটোই বিশুদ্ধ লাল।
প্রিন্টের জন্য CMYK-তে রূপান্তর করা যায়? স্ক্রিন কালার ফরম্যাট (HEX, RGB, HSL) এবং প্রিন্ট ফরম্যাট (CMYK) মৌলিকভাবে ভিন্ন কালার মডেল। গাণিতিক রূপান্তর আছে, কিন্তু সঠিক প্রিন্ট রঙের জন্য পেশাদার কালার ম্যানেজমেন্ট টুল ব্যবহার করা উচিত।
স্বচ্ছতা (আলফা) কী?
HEX অতিরিক্ত দুটি অক্ষর দিয়ে আলফা সমর্থন করে (#3B82F680)। RGB এবং HSL rgba() এবং hsla() ফাংশন হিসেবে সমর্থন করে। কালার কনভার্টার এই ফরম্যাটগুলোও পরিচালনা করে।
পরবর্তী ধাপ
রঙ রূপান্তরের পর, সুন্দর CSS গ্রেডিয়েন্ট তৈরি করতে গ্রেডিয়েন্ট জেনারেটর ব্যবহার করুন, বা আপনার নির্বাচিত রঙের চারপাশে সম্পূর্ণ কালার স্কিম তৈরি করতে কালার প্যালেট জেনারেটর ব্যবহার করুন।