Different CSS Frameworks(ready to use)
CSS stands for Cascading Style Sheets. Cascading Style Sheets or CSS is a simple mechanism for adding style (e.g., fonts, colors, spacing) to Web documents and modern-day Web-Apps.
Today, I am assuming that you know the basics of CSS and so, I am going to jump to the different CSS frameworks available for developers to just install, import, and use directly with their code without having to write the CSS themselves. The benefit of this being one - we can focus on the Application and still be able to make it look better.
1. Tailwind CSS: Low level, utility-first framework
Tailwind is a utility-first CSS framework packed with classes like flex, pt-4, text-center, and rotate-90 that can be composed to build any design, directly in your HTML.
Release date: November 2, 2017 Git star, Forks, Contributors: 42K, 1.9k, 255 Hacker News, Reddit, Stack overflow: NaN, 245,525 License: MIT No. of sites: 68,890 Documentation: Good Core concept: Utility first, responsive Grid: Flexbox Browser Support: All modern browser
2. Bootstrap: World’s Most Popular Framework
Bootstrap, the world’s most popular front-end open-source toolkit, featuring Sass variables and mixins, responsive grid system, extensive prebuilt components, and powerful JavaScript plugins.
Release date: August 19, 2011 Git star, Forks, Contributors: 150k, 73.5k, 2261 Used by: 2.5M+ Hacker News, Reddit, Stack overflow: 3.3k, 9k, 98k License: MIT No. of sites: 1,518,207,412 Documentation: Excellent Customization: Basic GUI Customizer (need to put color values manually) Core concept: RWD and mobile-first Learning Curve: Mild Grid: Flexbox-based up to 12 column Browser Support: Latest Chrome, Safari, Firefox, Opera, Safari, Edge & IE 10+, Android v5.0+
3. Materialize CSS: A Material Design Based CSS Framework
Materialize is a modern responsive front-end framework based on Material Design.
Release date: September 2011 Git star, Forks, Contributors: 38.5k, 4.9k, 262 Reddit, Stack overflow: 374, 3.2k License: MIT No. of sites: 111,481 Documentation: Good Customization: Basic GUI Customizer Core concept: RWD,mobile-first, semantic Grid: XY 12- Column grid,Floted (flexbox in latest version) Browser Support: Chrome 35+, Firefox 31+, Safari 9+, Opera, Edge, IE 11+
4. Material Design Lite: Light framework based on Material Design
Material Design Lite lets you add a Material Design look and feel to your websites. It doesn’t rely on any JavaScript frameworks and aims to optimize for cross-device use, gracefully degrade in older browsers, and offer an experience that is immediately accessible.
Release date: June 19, 2014 Git star, Forks, Contributors: 31.8k, 5.2k, 178 Used by: 10.5k+ Hacker News, Reddit, Stack overflow: NaN, 197, 648 License: Apache-2 No. of sites: 74,521 Documentation: Good Core concept: Cross-device use Learning Curve: Moderate Grid: 12: Desktop: 12 desktop, 8- tablet, 4- phone Browser Support: IE9, IE10, IE11, Chrome, Opera, Firefox, Safari, Chrome (Android), Mobile Safari
5. Bulma: Free, Open Source CSS Framework
Bulma is a free, open-source framework that provides ready-to-use frontend components that you can easily combine to build responsive web interfaces.
Release date: January 24, 2016 Git star, Forks, Contributors: 43.6k, 3.7k, 359 Reddit, Stack overflow: 1.2k, 581 License: MIT Downloads: 900k/Month Documentation: Good Customization: Basic GUI Customizer Core concept: RWD, mobile-first, Modern free Grid: Simple building of column layout Browser Support: Latest Chrome, Edge, Firefox, Opera, Safari, IE 10+ (Partially supported)
Fun Fact CSS was first proposed by Håkon Wium in October 1994.