یکی از زیبایی های دنیای طراحی، امکان استفاده از Gradient (گرادینت) هاست. اون ها شکل و شمایل بصری جذاب و متفاوتی رو به طرح هامون اضافه می کنن و باعث میشن طرح هایی که خلق می کنیم، یک مرحله از بقیه طرح ها بالاتر باشن. با من همراه باشید که شما رو با دنیای گرادینت ها و منابعی که اون ها رو به صورت اصولی و کامل ارائه میدن، آشنا می کنم.
مفهوم Gradient
وقتی که توی طراحی، به جای یک رنگ Solid از دو یا چند رنگ کنار هم استفاده کنیم، و بین این رنگ ها مرزی وجود نداشته باشه به طوری که با هم ادغام شده باشن، این ترکیب رو یک Gradient صدا می کنیم. Gradient ها از سال ۱۹۹۵ وارد دنیای طراحی و گرافیک شدن که توی اون زمان، به یکی از محبوب ترین و معروف ترین عناصر طراحی هم تبدیل شدن. با گذشت زمان، طراح ها متوجه شدن که چه خلاقیت هایی رو می تونن داخل Gradient ها به کار بگیرن. همین باعث شد که دنیا، شکل های جدیدی از Gradient ها رو به خودش ببینه و از اون ها داخل محصولات مختلف از فیزیکی تا دیجیتالی استفاده کنه.
معرفی وبسایت های Gradient
درسته که با استفاده از ابزار های طراحی پیش پا افتاده هم امکان ساختن Gradient ها رو به صورت دستی داریم، اما ما همیشه نمی دونیم که چه ترکیب رنگ هایی می تونن کنار هم یک Gradient زیبا و جذاب رو به وجود بیارن. به همین دلیل، خیلی خوبه به منابعی دسترسی داشته باشیم که به ما انواع و اقسام این گرادینت ها رو به صورت آماده و حرفه ای، همراه با کد رنگ ارائه میدن.
۱- Grabient
درسته که این وبسایت طرح های زیادی نداره، اما همه گرادینت هایی که داخلش وجود دارن، از همه لحاظ بهینه سازی شدن و برای استفاده آماده هستن.
شما برای همه این Gradient ها امکان ویرایش کردن حرفه ای هم دارید و به راحتی می تونید خروجی CSS هم از اون ها بگیرید.
این وبسایت به شما تمامی این گرادینت ها رو با پسوند Sketch که برای نرم افزار محبوب طراحی یعنی Sketchapp هستن هدیه می کنه و می تونید اون ها رو دانلود کنید و توی پروژه هاتون ازش استفاده
۲- GradientHunt
یکی از پرطرفدار ترین مراجع دانلود Gradient های رایگان با شکل های مختلف، از جمله Radial و Linear که تعداد خیلی زیادی گرادینت رو داخل خودش جا داده و به شما قابلیت کپی کد CSS هر Gradient رو میده، وبسایت Gradient Hunt هست.
همچنین می تونید با استفاده از ویرایشگر این وبسایت، خودتون هم طرح های زیبایی رو خلق کنید و از اون ها خروجی بگیرید.
۳- GradientsParty
به مهمونی Gradient ها خوش اومدید! این وبسایت هم مثل وبسایت Grabient یک سری از گرادینت ها رو گلچین کرده که می تونید به راحتی اون ها رو دانلود یا ویرایش کنید.
نوار بالایی وبسایت به شما امکان فیلتر بندی طرح ها رو بر اساس رنگ شون میده که این می تونه جستجوی شما رو ساده تر کنید.
۴- UIGradients
ساختار این وبسایت با وبسایت های قبلی ای که دیدیم، متفاوته. این وبسایت به شکلی تصادفی به شما گرادینت هایی رو نشون میده که می تونید از اون ها خروجی JPG دریافت کنید و به راحتی از اون ها استفاده کنید.
از منوی همبرگری این وبسایت به همه گرادینت های موجود در اون دسترسی خواهید داشت که با فیلتر بندی می تونید راحت تر به هدف خودتون برسید.
اگه روی کیبورد تون کلید Enter رو فشار بدین، به شما کد CSS اون Gradient رو نمایش میده و اگه کلید Space رو فشار بدین، امکان پیشنهاد کردن و افزودن طرح های جدید رو به وبسایت پیدا می کنین.
۵- Webgradients
این وبسایت، تعداد زیادی طرح رو برای شما به نمایش می ذاره که بیشتر طرح هاش از رنگ های نرم و ملایم تری استفاده می کنن. شما به کد های رنگی استفاده شده توی این طرح ها هم دسترسی دارید و می تونید مثل بقیه وبسایت هایی که معرفی کردم، کد های CSS اون ها رو برای استفاده توی برنامه نویسی به کار بگیرید.
جمع بندی
همه ما اگر به محصولات اطرافمون نگاه کنیم، حتما حضور Gradient ها رو درون شون احساس می کنیم. طراح ها همه روزه از این عنصر پرطرفدار طراحی استفاده می کنن و با گذشت زمان یاد گرفتن که چطور حرفه ای اون ها رو داخل طرح هاشون بیارن.
امیدوارم وبسایت هایی که توی این مقاله با شما به اشتراک گذاشتم، به کارتون بیان و براتون مفید باشن. خیلی خوبه که سعی کنیم داخل محصولات مون، از طرح ها هم بهره ببریم و فرهنگ استفاده اصولی از اون ها رو یاد بگیریم و با دیگران نشر بدیم. حتما منتظر مقاله های بیشتری درباره طرح ها و خواص اون ها داخل طراحی باشین. در آینده با انواع مختلف اون ها آشنا میشیم و توضیح میدیم که چه جاهایی می تونیم ازشون استفاده کنیم. راستی! اگه شما هم وبسایت های بیشتری رو می شناسید که طرح های رایگان و جذاب ارائه میدن، حتما باهامون درمیون بذارید.