تمام حقوق مادی و معنوی این ابزار متعلق به فرازگر است.

گرادینت چیست و چه کاری انجام می دهد

گرادینت یک نوع تصویر می باشد که از دو یا چند رنگ که به آرامی در هم محو می شوند تشکیل می شود و در نهایت تولید طیف های رنگی می کند. ساخت Gradient کار ساده‌ای نیست مخصوصاً اگر بخواهید تنظیمات خاصی به آن بدهید البته سایت هایی هستند مانند uigaradient که یک کدهای گرادینت آماده را در اختیار شما قرار می دهد اما ما اینجا در فرازگر ابزار پیشرفته ای را برای ساخت گرادینت CSS در نظر گرفته ایم که به آسانی و با سلیقه خود کدهای CSS گرادینت خود را تولید کنید.

نحوه ساخت گرادینت CSS به چه شکل است

برای ایجاد این نوع از gradient ها نیاز داریم که حداقل 2 رنگ مختلف را انتخاب کرده باشیم. کار gradient این است که بین این 2 رنگ به صورت نرم انتقال رنگی انجام دهد و direction جهت حرکت طیف را مشخص می‌کند. در صورتی که این خصوصیت را تعریف نکنید به صورت پیش فرض مسیر حرکت به سمت پایین است. ساختار کلی این دستور به شکل زیر است.

background-image: linear-gradient(direction, color-stop1, color-stop2, ...);

جهت‌ های حرکت می‌تواند به صورت های زیر تعریف شود:

  • to top right
  • to top left
  • to bottom right
  • to bottom left

درصورتی که بخواهید به جای استفاده از دستورات بالا از درجه استفاده کنید، کافیست مقدار مورد نظر خود را برای مثال به این شکل 225deg بکار ببرید

انواع گرادینت

ما در CSS دو نوع gradient می‌توانیم تعریف کنیم:

  • های linear (خطی): این gradient ها به صورت مورب به جهات مختلف (مانند بالا، پایین، راست و چپ) می روند.
  • gradient های radial (شعاعی): یک مرکز دارند و به صورت شعاع برای آن مرکز حرکت می کنند.

نحوه کار با ابزار ساخت گرادینت CSS

کار با این ابزار بسیار ساده است، کافیست دستک ها و رنگ ها را با توجه به نیاز خود تغییر داده تا به طیف رنگ مورد نظر خود برسید و سپس در آخر از سمت راست بر روی دکمه کپی دستورات CSS کلیک کنید تا در حافظه کلیپ بورد را ذخیره کنید تا بتوانید آن را در محل کد نویسی خود ذخیره کنید.

 

 

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *