Color Picker

# 🎨 RGB HSL
Live ৫ ফরম্যাট · শেড · হারমোনি · প্যালেট

Color Picker

হেক্স কালার কোড বের করুন, RGB/HSL স্লাইডার দিয়ে রং বানান, শেড ও কম্প্লিমেন্টারি কালার দেখুন — সব একসাথে

#F43F5E

স্লাইডার দিয়ে রং বানান

R
G
B
H
S
L

শেড ও টিন্ট (হালকা → গাঢ়)

কালার হারমোনি

Complementary
Analogous
Triadic
Tetradic

সাম্প্রতিক কালার (প্যালেট)

"Save" ক্লিক করলে কালার এখানে জমা হবে

কেন আমাদের Color Picker?

৫ ফরম্যাট

HEX · RGB · HSL · HSV · CMYK — সব কপিযোগ্য

হারমোনি

Complementary · Analogous · Triadic · Tetradic

১০০% প্রাইভেট

সব কিছু ব্রাউজারে · কোথাও ডেটা যায় না

প্রায়শই জিজ্ঞাসিত প্রশ্ন

HEX, RGB, HSL, HSV, CMYK — কোনটা কখন ব্যবহার করব?

HEX (#F43F5E) — ওয়েবসাইট CSS-এ সবচেয়ে বেশি ব্যবহৃত। RGB — ডিজাইন সফটওয়্যার (Photoshop, Figma) এবং স্ক্রিন ডিজাইনে। HSL — রঙের পার্থক্য বুঝতে সহজ (Hue/Saturation/Lightness)। HSV — কালার পিকার UI-তে জনপ্রিয়। CMYK — প্রিন্ট ডিজাইনে (বই, পোস্টার, ব্রোশিওর)।

শেড ও টিন্ট কী?

টিন্ট (tint) = মূল রঙে সাদা মিশিয়ে হালকা করা। শেড (shade) = মূল রঙে কালো মিশিয়ে গাঢ় করা। উপরের ১০টি বর্গ হলো ধাপে ধাপে হালকা থেকে গাঢ় — একই রঙের স্কেল। ক্লিক করলে সেই রঙ সিলেক্ট হবে।

কালার হারমোনি কী?

হারমোনি হলো রঙের নির্দিষ্ট গাণিতিক সম্পর্ক। Complementary = বিপরীত রঙ (hue + 180°)। Analogous = পাশাপাশি রঙ (hue ±30°)। Triadic = তিনটি সমান দূরত্বে (hue + 120°, +240°)। Tetradic = চারটি রঙ (hue + 60°, +180°, +240°)। এগুলো একসাথে ব্যবহার করলে সুন্দর ডিজাইন হয়।

Eyedropper দিয়ে স্ক্রিন থেকে রং নেওয়া যাবে?

হ্যাঁ! Chrome, Edge ও Opera-তে ডান দিকের রঙিন বর্গে (<input type="color">) ক্লিক করলে সিস্টেমের কালার পিকার খোলে — সেখানে eyedropper আইকন থাকে, যা দিয়ে পর্দার যেকোনো জায়গা থেকে রঙ নিতে পারবেন।

প্যালেট কোথায় সংরক্ষিত হয়?

আপনার ব্রাউজারের localStorage-এ — শুধু আপনার ডিভাইসেই। কোনো সার্ভারে যায় না। ট্যাব বন্ধ করলেও থেকে যায়, তবে অন্য ব্রাউজার বা ডিভাইসে দেখা যাবে না। "প্যালেট মুছুন" ক্লিক করে সব মুছে ফেলতে পারেন।

কোন রং একসাথে ভালো মানায়?

সাধারণ নিয়ম: একটি প্রাইমারি কালার (প্রধান), একটি সেকেন্ডারি (উপ), এবং একটি অ্যাকসেন্ট (হাইলাইট) — এতে ডিজাইন ভারসাম্যপূর্ণ হয়। হারমোনি সেকশনে "Complementary" থেকে দুটি রঙ একসাথে ব্যবহার করলে দুর্দান্ত কনট্রাস্ট পাওয়া যায়।

CSS-এ কীভাবে ব্যবহার করব?

এইচটিএমএল/সিএসএস-এ সরাসরি ব্যবহার করুন: background: #F43F5E; বা color: rgb(244, 63, 94); বা border-color: hsl(350, 89%, 60%);। প্রতিটি ফরম্যাট চিপে ক্লিক করলে সেটি কপি হয়ে যাবে — সরাসরি paste করুন।

HEX-এ transparency (alpha) যোগ করা যায়?

হ্যাঁ! ৮-ডিজিটের HEX ব্যবহার করুন: #F43F5E80 (শেষ 80 = 50% opacity)। অথবা CSS-এ আলাদা করুন: background: #F43F5E; opacity: 0.5;। এই টুলে বর্তমানে ৬-ডিজিটের HEX দেওয়া হয় — alpha দরকার হলে শেষে যোগ করুন।

সম্পন্ন!