معرفی 11 قالب رایگان مدرن

img
img
img
img
shape
shape
blog-details
23
اردیبهشت
معرفی 11 قالب رایگان مدرن
نویسنده : محمدرضا لیایی
دسته بندی : عمومی
سطح مقاله : مقدماتی
زمان مطالعه : 10 دقیقه

در این مقاله کوتاه قصد داریم تا شما را با لیستی از قالب های Html متن باز و رایگانی که توسط فروشگاه اینترنتی creative-tim طراحی شده است آشنا کنیم. تمامی این قالب ها به صورت رایگان در گیت هاب جهت دانلود و توسعه توسط فرانت اند کاران و استفاده در پروژه های مختلف قرار داده شده است. لایسنس این قالب ها  MIT License است به همین خاطر شما می تواند در تمامی پروژه ها از قبیل پروژه های تجاری و متن باز از این template ها استفاده کنید. برای اون دسته از کاربرانی که با creative-tim آشنا نیستند باید گفت که creative-tim یک آژانس تولید قالب برای وب سایت ها با تکنولوژی های مختلف است که در دوسته تجاری و متن باز محصولات خود را به بازار عرضه می کند روش های طراحی قالب در این وب سایت معمولا بر پایه فریمورک های React، Vue، Svelete bootstrap و tailwind است.

پنل مدیریتی Soft UI Dashboard

این پنل مدیریتی براساس 70 المان مستقل فرانت اندی ایجاد شده است. این المان ها شامل مواردی همچون buttons، inputs، navbar، navtabs و cards در رنگ های مختلف است که جلوه ای بسیار زیادی به پانل مدیریتی شما می دهد. اگر نیاز دارید که اصلاحاتی در این پانل مدیریت انجام دهید اصلا نگران نباشید فایل های sass برای این پروژه نیز در درون گیت هاب بارگذاری شده است که به راحتی می توانید با استفاده از آن تغییرات مد نظر خود را در پروژه اعمال کنید. لازم به ذکر است که این template از bootstrap 5 برای پانل مدیریت استفاده می کند.

soft ui

کیت Soft ui

اغلب سیستم های طراحی های انجام شده توسط گروه creative-tim با استفاده از فریمورک بروز bootstrap 5 طراحی شده اند. تمامی این محصول تحت لیسانس MIT License در گیت هاب منتشر می شود. شما با استفاده از کیت Soft UI Design System می توانید وب سایت های جذاب و خیره کننده ای را ایجاد نمائید.

soft ui design

پنل مدیریت ری اکتی

داشبورد react شرکت creative-tim توسط کتابخانه material ui ری اکت طراحی شده است. در این طراحی از ابزار معروف google material design الهام گرفته شده است. این ترکیب خیره کننده ما را خیلی هیجان زده کرده است که می توانیم از مفهوم material به سادگی هرچه تمام تر در پنل مدیریت استفاده کنیم. این پنل مدیریت توسط matrial-UI ورژن 4 طراحی شده است.

react material dashboard new

پنل مدیریت ری اکتی Argon

این پنل مدیریت شامل 100 المان جداگانه ری اکتی است که آزادی عمل مثال زدنی به یک طراح ui می دهد. شما به عنوان طراح فرانت اند با استفاده از این سیستم می توانید عناصر رنگی متفاوت را با یکدیگر ترکیب کنید و حتی در صورت نیاز با استفاده از فایل sass موجود در پوشه پروژه رنگ ها را تغییر دهید که آزادی عمل را به شما جهت انتخاب و ترکیب عناصر می دهد.

argon dashboard material

پنل مدیریت Dark react

داشبورد dark react توسط بوت استرپ 4 که با ری اکت ترکیب شده است بر روی این فریمورک  پیاده سازی شده است. این قالب از تعداد بسیار زیادی المان تشکیل شده است و هنگامی که در کنار هم قرار می گیرند شکل و شمایل بسیار زیبائی را به این داشبورد می دهند. اگر شما به دنبال ابزاری جهت نمایش زیبای اطلاعات تجاری خود هستید این داشبورد گزینه مناسبی برای شما است. رنگ بندی این قالب به گونه ای که نوشته ها و اعداد به خوبی در دید انسان از هم تمیز داده می شوند.

black dashboard react

پنل مدیریت کسب به سبک vue

همانطور که از نام این پنل مدیریت پیدا است این پنل توسط vuejs و bootstrap 4 ایجاد شده است. این پنل برای هر زمانی که بخواهید استارت توسعه یک پانل مدیریت را بزنید مناسب است. این پنل ورژن رسمی Light bootstrap dashboard است. استفاده از این داشبورد بسیار ساده است اما نیاز مند دانش جاوا اسکریپت، vue و vuejs است. در کنار تمامی این موارد می بایست دانشی از vue router را نیز داشته باشید.

vue light bootstrap

قالب پنل مدیریتی vuetify

قالب vuetify توسط مشخصه های Material design مورد طراحی قرار گرفته است. هر کامپوننتی در این صفحه به صورت دست ساز برای شما آماده شده است تا بهترین ابزار UI را برای توسعه نرم افزار شما به وجود آورد. این قالب با پشتیبانی جامعه بزرگ استفاده کنندگان خود علاوه بر المان های پیشفرض، کامپوننت های فراوانی را نیز برای زیبا سازی کار شما در نظر گرفته است.

vuetify material dashboard

قالب vue black dashboard

قالب مشکی vue یکی از زیباترین قالب هایی است که توسط bootstrap 4 و vuejs ساخته شده است. این قالب از تعداد بسیار زیادی کامپوننت تشکیل شده است که به صورت یکپارچه در کنار یک دیگر قرار گرفته اند و زیبایی مثال زدنی را به این قالب مدیریت داده اند. این قالب همان چیزی است که می تواند مورد پسند شما قرار گیرد. ترکیبات رنگی این قالب به گونه ای است که در پس زمینه سیاه آن به خوبی بتوان نوشته ها و المان ها را دنبال کرد. استفاده از این مورد را ما به شما پیشنهاد می کنیم.

vue black dashboard

داشبورد Material Nextjs

پانل مدیریتی Nextjs یک Material-ui رایگان است. یکی از برتری های این پانل استفاده همزمان از Nextjs و React  است که الهام گرفته از google material design است که این مورد را بسیار هیجان انگیز می کند.

next js material dashboard

قالب Notus بر پایه Tailwind css

نمی دونیم شما تا حالا با Tailwind کار کردید یا نه اما شما می توانید با استفاده از این قالب بروز، توسعه خود را بر پایه ابزارهایی همچون Nextjs و Tailwind قرار دهید. با استفاده از این قالب اجازه می دهید تا tailwind شما را به دنیای تازه ای از طراحی و توسعه فرانت اند وب سایت ببرد. ما به شما توصیه استفاده از این قالب را در طراحی های آینده فرانت اند تان می کنیم.

notus next js

قالب مدیریتی Argon next js

کلمه Argon نامی است که سایت creative-tim به آن بسیار علاقه مند است و قالب های زیادی از این وب سایت پسوند و یا پییشوند آرگون را با خود یدک می کشند. داشبورد nextjs Argon با بهره گیری از فناوری nextjs توانسته است شامل 100 عدد از کامپوننت های مستقل شود که به شما اجازه انتخاب های آزادانه المان ها در کنار ترکیب های شگفت انگیز را می دهد. تمامی component ها قابلیت تغییر رنگ را دارند و تمامی آن ها را می توان توسط فایل های sass اصلاح کرد و به کار برد. این قابلیت باعث صرفه جوئی بسیار زیادی در زمان طراحی  فرانت اند می شود و تمامی این مزیت ها به این دلیلی است که المان ها به سهولت در دسترس هستند. این داشبورد به صورت پیشفرض از مثال های پیش ساخته ای پشتیبانی می کند. پس ساختن همچنین پنل مدیریتی بسیار ساده است و می توانیم به سادگی روی یک وب سایت واقعی آن را تست کنیم.

next js argon

 منبع: dev.to