ভূমিকা
ওয়েব ডিজাইনে রঙ খুবই গুরুত্বপূর্ণ — এটি ভিজ্যুয়াল আকর্ষণ, UI অভিজ্ঞতা ও brand identity নির্ধারণ করে।
HTML এ রঙ ব্যবহার করা হয় টেক্সট, ব্যাকগ্রাউন্ড, বর্ডার, বাটন, লিংক এমনকি পুরো সেকশনে।
চলুন HTML Colors কীভাবে কাজ করে তা শেখা যাক।
HTML এ রঙ কীভাবে নির্ধারণ হয়?
HTML এ সাধারণত CSS ব্যবহার করে রঙ সেট করা হয়।
রঙ নির্ধারণ করা যায়—
- Color Name
- Hexadecimal Code
- RGB & RGBA
- HSL & HSLA
১) Color Name ব্যবহার
HTML এ ১৪০+ predefined color name আছে।
উদাহরণ রঙ: red, blue, green, orange, purple, black, white
২) Hexadecimal (HEX) রঙ কোড
Hex code ৬ digit — যেমন:
| রঙ | Hex Code |
|---|---|
| লাল | #FF0000 |
| সবুজ | #00FF00 |
| নীল | #0000FF |
| কালো | #000000 |
| সাদা | #FFFFFF |
৩) RGB রঙ
RGB = Red, Green, Blue
প্রতিটি মান ০ থেকে ২৫৫ পর্যন্ত।
৪) RGBA — Transparency সহ রঙ
RGBA তে a = alpha (opacity)
0.0 = transparent, 1.0 = solid
৫) HSL — Hue, Saturation, Lightness
রঙের tone ও brightness কন্ট্রোল করা যায়।
৬) HSLA — HSL + Transparency
<p style="background-color: hsla(240, 100%, 50%, 0.5);">
Transparent Blue Background
</p>
HTML Colors কোথায় ব্যবহার হয়?
- টেক্সটের রঙ
- ব্যাকগ্রাউন্ড রঙ
- বর্ডার, বাটন, লিংক
- হেডিং/সেকশন হাইলাইট
- UI থিম ও ব্র্যান্ডিং
Color Palette & UI Tips
- হালকা ব্যাকগ্রাউন্ড + গাঢ় টেক্সট → readable
- Same brand color everywhere = consistency
- Contrast maintain করুন accessibility এর জন্য
Complete Example
><h2 style=“color: #2c3e50;”>HTML Color Examples</h2>
<html>
<head>
<title>HTML Colors Example</title>
</head>
<body style="background-color: #fafafa;"><p style=“color: red;”>Named Color</p>
<p style=“color: #FF5733;”>Hex Color</p>
<p style=“color: rgb(0,128,0);”>RGB Color</p>
<p style=“background-color: rgba(0, 0, 255, 0.2);”>RGBA Background</p>
<p style=“color: hsl(240, 100%, 50%);”>HSL Color</p>
<p style=“background-color: hsla(340, 100%, 60%, 0.3);”>HSLA Background</p>
</body>
</html>
Best Practices
- ব্র্যান্ড রঙ palette ব্যবহার করুন
- অ্যাক্সেসিবিলিটি অনুযায়ী contrast maintain করুন
- CSS class এর মাধ্যমে styling করা ভালো — inline style কম ব্যবহার করুন
- consistent UI/UX follow করুন
