چگونه از کدهای تولید شده استفاده کنم؟

کافیست روی دکمه «کپی کد» کلیک کنید. سپس کد کپی شده را در فایل CSS خود به عنوان مقدار ویژگی background یا background-image برای عنصر مورد نظر قرار دهید.

تولیدکننده گرادیان CSS آنلاین

Q: گرادیان خطی (Linear Gradient) در CSS چیست؟

گرادیان خطی به شما اجازه میدهد تا یک انتقال ملایم و تدریجی بین دو یا چند رنگ در یک خط مستقیم (مثلا از بالا به پایین یا چپ به راست) ایجاد کنید که معمولا برای زیباسازی پسزمینهها استفاده میشود.

رنگ اول:

#ff00cc

رنگ دوم:

#333399

جهت گرادیان:

کد CSS:

ابزار آنلاین ساخت گرادیان (Gradient)

گرادیان‌ها (Gradients) یکی از جذاب‌ترین تکنیک‌ها در طراحی رابط کاربری (UI) هستند که به شما اجازه می‌دهند به جای استفاده از یک رنگ یکنواخت، از ترکیب نرم و پیوسته دو یا چند رنگ استفاده کنید. با استفاده از ابزار تولیدکننده گرادیان CSS، دیگر نیازی به نوشتن دستی و حفظ کردن سینتکس پیچیده CSS ندارید.

ویژگی‌های این ابزار:

انتخابگر رنگ بصری: رنگ‌های آغازین و پایانی را به راحتی از پالت رنگ انتخاب کنید.

تعیین جهت: با یک کلیک مشخص کنید گرادیان از کدام سمت به کدام سمت کشیده شود (مثلاً از بالا به پایین یا مورب).

دکمه رنگ‌های تصادفی: اگر برای انتخاب رنگ ایده ندارید، اجازه دهید ابزار برای شما ترکیب‌های تصادفی و جذاب بسازد.

کپی آسان: کد CSS نهایی و کاملاً استاندارد را با یک کلیک کپی کرده و در پروژه خود استفاده کنید.

سوالات متداول (FAQ)

گرادیان خطی (Linear Gradient) در CSS چیست؟ ▼

گرادیان خطی قابلیتی در CSS است که به شما اجازه می‌دهد تا یک انتقال ملایم و تدریجی بین دو یا چند رنگ در یک خط مستقیم (مثلا از بالا به پایین یا چپ به راست) ایجاد کنید. این افکت معمولاً برای عمق دادن به دکمه‌ها، پس‌زمینه‌ها و بخش‌های مختلف سایت استفاده می‌شود.

چگونه از کدهای تولید شده در پروژه خود استفاده کنم؟ ▼

پس از انتخاب رنگ‌ها و جهت مورد نظر، روی دکمه «کپی کد» کلیک کنید. سپس به فایل استایل (CSS) پروژه خود بروید و کد کپی شده را به عنوان مقدار مشخصه background یا background-image برای تگ HTML مورد نظر (مانند div یا body) الصاق (Paste) کنید.