📌 این ویژگی مشخص می‌کنه که گرادیانت پس‌زمینه از چه رنگ‌هایی شروع و به چه رنگ‌هایی ختم شود.
در Tailwind از کلاس‌های from-*, via-*, to-* استفاده می‌کنیم.

✅ کلاس‌ها

• from-{color} → رنگ شروع گرادیانت

• via-{color} → رنگ میانی گرادیانت (اختیاری)

• to-{color} → رنگ پایان گرادیانت

📌 رنگ‌ها می‌توانند از پالت Tailwind یا رنگ دلخواه سفارشی باشند:

• from-red-500, via-yellow-300, to-green-500

• from-[#ff5733] برای رنگ دلخواه

✅ مثال

<div class="h-32 w-48 bg-gradient-to-r from-red-500 to-yellow-500 mb-2">
  گرادیانت از قرمز به زرد
</div>

<div class="h-32 w-48 bg-gradient-to-r from-blue-500 via-green-500 to-pink-500 mb-2">
  گرادیانت با رنگ میانی
</div>

<div class="h-32 w-48 bg-gradient-to-b from-[#ff5733] to-[#33ffdd] mb-2">
  گرادیانت سفارشی با رنگ HEX
</div>

📌 نکات مهم

• to-* همیشه رنگ پایان گرادیانت را مشخص می‌کند.

• via-* اختیاری است و برای ایجاد رنگ میانی استفاده می‌شود.

• جهت گرادیانت با کلاس‌های bg-gradient-to-r, bg-gradient-to-l, bg-gradient-to-t, bg-gradient-to-b` مشخص می‌شود.