এইচটিএমএল কালার টিউটোরিয়াল (বাংলায়)

এইচটিএমএল-এ কালার ব্যবহার করা হয় ওয়েব পেজের টেক্সট, ব্যাকগ্রাউন্ড, বর্ডার ইত্যাদি স্টাইল করতে। এই টিউটোরিয়ালে আমরা শিখব কীভাবে এইচটিএমএল এবং সিএসএস-এ রং ব্যবহার করা যায়।

১. কালার নির্ধারণের পদ্ধতি

এইচটিএমএল এবং সিএসএস-এ রং নির্ধারণের জন্য নিম্নলিখিত পদ্ধতি ব্যবহৃত হয়:

• কালার নাম: সরাসরি রঙের নাম ব্যবহার করা (যেমন red, blue)।
• হেক্সাডেসিমাল (Hex): #RRGGBB ফরম্যাটে (যেমন #FF0000)।
• আরজিবি (RGB): rgb(red, green, blue) ফরম্যাটে (যেমন rgb(255, 0, 0))।
• এইচএসএল (HSL): hsl(hue, saturation, lightness) ফরম্যাটে (যেমন hsl(0, 100%, 50%))।
• RGBA/HSLA: স্বচ্ছতার জন্য (যেমন rgba(255, 0, 0, 0.5))।

২. কালার ব্যবহারের উদাহরণ

<p style="color: blue;">এই টেক্সটটি নীল রঙে প্রদর্শিত হবে।</p>
        

<p style="color: #FF0000;">এই টেক্সটটি লাল রঙে প্রদর্শিত হবে।</p>
        

<p style="background-color: rgb(0, 128, 0); color: white;">এই টেক্সটটির ব্যাকগ্রাউন্ড সবুজ রঙে।</p>
        

<p style="background-color: hsl(240, 100%, 50%); color: white;">এই টেক্সটটির ব্যাকগ্রাউন্ড নীল রঙে।</p>
        

<p style="background-color: rgba(255, 165, 0, 0.5); color: black;">এই টেক্সটটির ব্যাকগ্রাউন্ড কমলা রঙে, স্বচ্ছতা সহ।</p>
        

৩. কালার ব্যবহারের টিপস

• কালার নাম: সহজ কিন্তু সীমিত (প্রায় ১৪০টি নামকৃত রং আছে)।
• হেক্স কোড: সুনির্দিষ্ট রং নির্বাচনের জন্য বহুল ব্যবহৃত।
• RGBA/HSLA: স্বচ্ছতার জন্য উপযোগী।
• কালার পিকার: রং নির্বাচনের জন্য অনলাইন কালার পিকার টুল ব্যবহার করুন।
• কনট্রাস্ট নিশ্চিত করুন যাতে টেক্সট পঠনযোগ্য হয়।

৪. সাধারণ কালার কোড

কিছু জনপ্রিয় হেক্স কোড:

• লাল: #FF0000
• সবুজ: #00FF00
• নীল: #0000FF
• কালো: #000000
• সাদা: #FFFFFF