---

CSS গ্রেডিয়েন্ট কী?

CSS গ্রেডিয়েন্ট আপনাকে ছবি ফাইল ব্যবহার না করে দুই বা তার বেশি রঙের মধ্যে মসৃণ পরিবর্তন প্রদর্শন করতে দেয়। এগুলো তিন ধরনের: linear-gradient (সরল রেখা বরাবর), radial-gradient (কেন্দ্রীয় বিন্দু থেকে বিকিরণ), এবং conic-gradient (কেন্দ্রীয় বিন্দুর চারপাশে ঘুরে)। গ্রেডিয়েন্ট পটভূমি, বোতাম, ওভারলে এবং সাজসজ্জার উপাদানের জন্য ব্যবহৃত হয়।

CSS গ্রেডিয়েন্ট জেনারেটর কীভাবে ব্যবহার করবেন

1. সোয়াচ থেকে একটি প্রিসেট বেছে নিন বা নিজের গ্রেডিয়েন্ট কনফিগার করুন।

2. গ্রেডিয়েন্টের ধরন বেছে নিন: linear, radial বা conic।

3. কোণ (linear/conic এর জন্য) বা আকৃতি (radial এর জন্য) সামঞ্জস্য করুন।

4. রঙের স্টপ সম্পাদনা করুন — রঙ এবং অবস্থান (0–100%) পরিবর্তন করুন।

5. প্রয়োজনমতো রঙের স্টপ যোগ করুন বা সরিয়ে দিন।

6. CSS কপি করুন এবং আপনার স্টাইলশিটে পেস্ট করুন।

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

আমি কীভাবে একটি স্বচ্ছ গ্রেডিয়েন্ট তৈরি করব? rgba() বা hsla() রঙের মান ব্যবহার করুন যার সম্পূর্ণ স্বচ্ছতার জন্য আলফা চ্যানেল 0। উদাহরণস্বরূপ, rgba(0,0,0,0) রঙের স্টপ সম্পূর্ণ স্বচ্ছ কালো, ছবিগুলিতে ফেড-আউট ওভারলেগুলির জন্য উপকারী।

আমি কীভাবে একটি কঠিন রঙের স্টপ (কোনও রূপান্তর নেই) তৈরি করব? একই অবস্থানে দুটি রঙের স্টপ রাখুন — একটি সমাপ্ত এবং একটি সেই বিন্দুতে শুরু। উদাহরণস্বরূপ, লাল 50%, নীল 50% মধ্যবিন্দুতে কোনও গ্রেডিয়েন্ট রূপান্তর ছাড়াই লাল থেকে নীলে একটি তাত্ক্ষণিক স্যুইচ তৈরি করে।

কোন ব্রাউজারগুলি কনিক গ্রেডিয়েন্টগুলি সমর্থন করে? কনিক গ্রেডিয়েন্টগুলি সমস্ত আধুনিক ব্রাউজারে সমর্থিত (Chrome 69+, Firefox 83+, Safari 12.1+, Edge 79+)। তারা Internet Explorer এ সমর্থিত নয়।

আমি কি একই উপাদানে একাধিক গ্রেডিয়েন্ট ব্যবহার করতে পারি? হ্যাঁ। CSS পটভূমি কমা-বিচ্ছিন্ন স্তরগুলির একটি তালিকা গ্রহণ করে। আপনি গ্রেডিয়েন্টগুলি স্ট্যাক করতে পারেন, সেগুলিকে পটভূমি চিত্রগুলির সাথে একত্রিত করতে পারেন এবং প্রতিটি স্তরের অবস্থান এবং আকার স্বাধীনভাবে নিয়ন্ত্রণ করতে পারেন।

Keywords: CSS গ্রেডিয়েন্ট জেনারেটর, লিনিয়ার গ্রেডিয়েন্ট, রেডিয়াল গ্রেডিয়েন্ট, কনিক গ্রেডিয়েন্ট, CSS ব্যাকগ্রাউন্ড জেনারেটর, গ্রেডিয়েন্ট রঙ নির্বাচক, CSS গ্রেডিয়েন্ট টুল