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

ترجمه و تالیف : ارسطو عباسی
تاریخ انتشار : 13 خرداد 98
خواندن در 3 دقیقه
دسته بندی ها : 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 – یک مجموعه رایگان از ۱۸۰ گرادینت خطی که می شود در هر قسمت وبسایت از آن‌ها استفاده نمایید.

گردآوری و تالیف ارسطو عباسی
آفلاین
user-avatar

من ارسطو‌ام :) کافی نیست؟! :)

دیدگاه‌ها و پرسش‌ها

برای ارسال نظر لازم است ابتدا وارد سایت شوید
در حال دریافت نظرات از سرور، لطفا منتظر بمانید