50 ابزار، فریمورک و کتابخانه سی‌اس‌اس در سال 2017

گردآوری و تالیف : ارسطو عباسی
تاریخ انتشار : 18 اسفند 1396
دسته بندی ها : css

با تمام تغییرات و موفقیت‌هایی که در سی‌اس‌اس می‌افتد ما نباید نسبت به میزان ابزارها و منابعی که به صورت رایگان عرضه شده اند شگفت زده شویم. این کتابخانه‌ها و ابزارهای سی‌اس‌اس زندگی شما را آسان‌تر می کنند و در پیاده‌سازی مواردی که در سی‌اس‌اس آن‌ها را به خوبی درک نکرده‌اید یا در یادگیری آن‌ها مشکل دارید کمک می‌کند. 

در این مطلب قصد داریم ۵۰ کتابخانه، ابزار و فریمورک محبوب که در سال ۲۰۱۷ عرضه شده اند را به شما معرفی کنیم. 

۱- Waffle Grid – یک راه ساده برای استفاده از سیستم شبکه‌ای فلکس‌باکس.

۲- RAGrid – یک سیستم شبکه‌ای فلکس‌باکس که بجای استفاده از کلاس‌ها از صفات شناخت‌پذیر استفاده می‌کند.

۳- Taffy – یک فریمورک مدرن، سبک و متن باز سی‌اس‌اس که براساس فلکس‌باکس درست شده است.

۴- Griddd – یک سیستم شبکه‌بندی ساده و قابل شخصی سازی است که براساس بر فلکس‌باکس طراحی شده است.

۵- Flexbox Cheatsheet – یک راهنمای تعاملی است که به شما در یادگیری خاصیت‌های فلکس‌باکس سی‌اس‌اس کمک می‌کند. همراه با این ابزار مثال ها و نمونه‌های بسیاری نیز عرضه شده است. 

۶- Griddy – یک ابزار آنلاین رایگان برای یادگیری سیستم شبکه‌بندی در سی‌اس‌اس است.

۷- Graaf – مجموعه ای از شبکه‌هایی که به صورت خالص با سی‌اس‌اس نوشته شده اند.

۸- CSS Grid Cheat Sheet – یک سرویس برای راهنمایی بصری راجع به سیستم شبکه‌بندی سی‌اس‌اس است.

۹- Bttn.css – کتابخانه‌ای همراه با دکمه‌های بسیار عالی برای پروژه‌های عالی!

۱۰- Hover Buttons Library – کتابخانه‌ای شامل مجموعه‌ای از دکمه‌های css/scss انیمیشنی.

۱۱- Buttons – کتابخانه‌ای شامل مجموعه‌ای از دکمه‌های مختلف ساخته شده با سی‌اس‌اس.

۱۲- Social Share Kit – کتابخانه‌ای شامل تعدادی از ابزارهای ساخته شده با سی‌اس‌اس/جاوااسکریپت برای دکمه‌های شبکه‌های اجتماعی -دکمه‌های اشتراک‌گذاری، آیکون‌های شبکه اجتماعی و… .-

۱۳- Foundation Building Blocks – مجموعه‌ای از صدها ابزار برای شروع ایجاد پروژه‌تان.

۱۴- Balloon.css – ابزار تول‌تیپ ساده که به صورت کامل با سی‌اس‌اس ایجاد شده است.

۱۵- Fontisto – فونتی زیبا و ابزاری مناسب برای سی‌اس‌اس.

۱۶- Pretty Checkbox – کتابخانه‌ای کامل برای زیباسازی چک‌باکس‌ها و رادیو‌باتن‌ها -ایجاد شده کاملا با سی‌اس‌اس-.

۱۷- CSS Checkbox Library – مجموعه عظیمی از چک‌باکس‌های ساخته شده با CSS که می‌شود در هر پروژه ای استفاده نمود.

۱۸- explodal – یک پنجره Modal است که ۹۷ درصد آن از سی‌اس‌اس ساخته شده، یک خط جاوااسکریپت در آن بکار برده شده و در نهایت یک GIF کوچک نیز در آن قرار داده شده است.

۱۹- SCSS Only Slider – این آموزش به شما کمک می کند تا بتوانید تنها با استفاده از SCSS اسلایدر مورد نظر خود را ایجاد کنید.

۲۰- CSS Loader – با استفاده از این ابزار می توانید تا به کار بردن یک div و کدهای سی‌اس‌اس یک لودر زیبا برای وب اپلیکیشن‌های خود ایجاد کنید.

۲۱- Animatelo – ابزاری مناسب برای قرار دادن انیمیشن‌ها و استفاده از آن‌ها با استفاده از API در وبسایت است.

۲۲- Vivify – یک کتابخانه رایگان سی‌اس‌اس برای انیمیشن‌های وب.

۲۳- Animista – مکانی شامل انیمیشن‌های سی‌اس‌اس که برای وبسایت می توانید از آن‌ها استفاده کنید. در این وبسایت قبل از استفاده می توانید هر نمونه را آزمایش نمایید.

۲۴- Obnoxious.CSS – انیمیشن‌هایی برای قلب قوی و مغز ضعیف!

۲۵- 50 Cheatsheets, References and Guides for CSS – مجموعه بسیار بزرگی از راهنماها و دستورات برای یادگیری سی‌اس‌اس و خاصیت‌های آن.

۲۶- CSS Database – یک لیست جامع از خاصیت‌های سی‌اس‌اس و جایگاه ‌آن‌ها برای پیاده‌سازی.

۲۷- CSS Triggers – یک منبع تعاملی برای اینکه متوجه شوید چگونه خاصیت‌های سی‌اس‌اس از منابع مرورگر استفاده می‌کنند.

۲۸- Flawless Typography Checklist – یک دوره آموزشی کامل برای استفاده از تایپوگرافی.

۲۹- Sassmagic – یک منبع راهنمای بسیار عظیم برای SASS.

۳۰- Boilrplate – یک دایرکتوری کامل از زبان‌های مختلف از جمله سی‌اس‌اس برای شروع نوشتن پروژه‌تان.

۳۱- Fractures – یک ابزار مقدماتی برای پیاده‌سازی سیستم‌های طراحی بوت استرپ و نمونه‌ها با استفاده از یکسری کلاس‌های کمکی.

۳۲- Biomatic UI – یک فریمورک سی‌اس‌اس با تکیه بر طراحی اتمی.

۳۳- Tailwind CSS – یک فریمورک سی‌اس‌اس برای ایجاد کارایی و تسریع عملیات توسعه رابط کاربری.

۳۴- PaperCSS – یک فریمورک سی‌اس‌اس با خصوصیات ظاهری کمتر.

۳۵- Shoelace.css – یک بازگشت به ابزارهای پایه‌ای سی‌اس‌اس، برای زمانی که احتیاجی به همه موارد ندارید.

۳۶- Turret CSS – یک فریمورک عادی برای تسریع فرایند توسعه وبسایت و پیاده‌سازی حالت دسترسی‌پذیری.

۳۷- Trowel – یک ابزار SASS که به شما اجازه می‌دهد تا فریمورک‌های سی اس‌اس را ایجاد نمایید و از آن‌ها بهره ببرید.

۳۸- Unnamed – یک فریمورک رنگی که توسط انسان طراحی شده نه یک هوش مصنوعی!

۳۹- awsm.css – یک کتابخانه زیبای سی‌اس‌اس برای semantic HTML markup  -حالتی که در آن از تگ‌های اچ‌تی‌ام‌ال برای مفهوم بخشی بیشتر به محتوا استفاده می شود- که در آن از هیچ کلاس یا خاصیتی استفاده نشده است.

۴۰- Brutalist Framework – یک فریمورک متن باز که در آن تکنیک‌های طراحی وبسایت وجود دارد.

۴۱- BBC Grandstand – مجموعه‌ای از کلاس‌های کمکی معروف در سی‌اس‌اس.

۴۲- iotaCSS – یک فریمورک هوشمند، متن باز که مبتنی بر حالت OOCSS در Sass است. 

۴۳- Semantic UI – یک فریمورک توسعه که با استفاده از HTML به شما این قابلیت را می دهد تا لایه‌بندی زیبا و واکنشگرایی را ایجاد نمایید.

۴۴- Luxbar – یک منوبار واکنشگرا و سبک که با سی‌اس‌اس ایجاد شده است.

۴۵- mini.css – هدف این کتابخانه پیاده سازی کارایی بالاست.

۴۶- Wireframe CSS – یک فریمورک مینیمال سی‌اس‌اس برای ساختن نمونه ها.

۴۷- Less Grid Boilerplate – یک سیستم شبکه‌بندی ۱۲ ستونه سبک که با سی‌اس‌اس و LESS ساخته شده است.

۴۸- kernel.css – یک فریمورک بسیار زیبا و سبک سی‌اس‌اس و جاوااسکریپت که از فضای طراحی متریال الهام گرفته است.

۴۹- Petal – یک فریمورک رابط کاربری سبک و مدرن که بر پایه LESS ساخته شده است.

۵۰- Tent CSS – یک کتابخانه که از زندگی خارجی الهام گرفته است، این کتابخانه به صورت شگفت انگیزی ساده و قدرتمند است. این فریمورک برای زمانی طراحی شده است که بخواهید وبسایت عالی را طراحی نمایید.

۵۱- Spectre.css – یک فریمورک سبک، واکنشگرا و مدرن برای توسعه سریع‌تر و بزرگ‌تر.

۵۲- Gradientify – مجموعه بسیار خوبی از گرادینت‌های سی‌اس‌اس که می توانید کدهای آن‌ها را کپی نمایید.

۵۳- Critical Path CSS Generator – تسریع فرایند رندر صفحات.

۵۴- Grabient – یک ابزار آنلاین برای ایجاد هرنوع از گرادینت‌ها که می شود به عنوان سی‌اس‌اس یا برنامه Sketch اکسپورت شود.

۵۵- CSSRooster – یک بات است که کلاس‌های سی‌اس‌اس را برای تگ‌های اچ‌تی‌ام‌ال با قابلیت یادگیری بالا می نویسد.

۵۶- WebGradients – یک مجموعه رایگان از ۱۸۰ گرادینت خطی که می شود در هر قسمت وبسایت از آن‌ها استفاده نمایید.

مقالات پیشنهادی

50 افزونه و کتابخانه برتر جاوا اسکریپت برای سال 2017

تمام پلاگین ها و کتابخانه های جاوا اسکریپت در این صفحه  رایگان بوده و همگی کارکردهای مشخص و ویژه ای دارند. هیچ فریمورک تمام عیاری در بین آن ها وجود ند...

12 کتابخانه جاوا اسکریپت برای استفاده در سال 2017

با وجود صد‌ها کتابخانه مختلفی که تا به حال برای جاوا اسکریپت عرضه شده است، انتخاب یک کتابخانه برای یادگیری و کار با آن بسیار سخت است. ممکن است بعضی از...

روند‌های طراحی وب در سال ۲۰۱۷

با نزدیک شدن به پایان سال ۲۰۱۷، وقت آن است که با همدیگر نگاهی به قابل‌ توجه ترین روند‌های طراحی وب در سال ۲۰۱۷ بیاندازیم. در این مطلب می‌توانید شاهد ل...

۱۰ مورد از بهترین فریمورک‌های CSS در سال ۲۰۱۸

به صورت بسیار ساده‌ای ما می‌توانیم HTML را یک ساختمان در نظر بگیریم و CSS را مانند یک لایه که طراحی را بر روی این ساختمان اعمال می‌کند. CSS یکی از اجز...