CSS Frameworks is something we have already written about a few years ago with an extensive list of the best css frameworks anyone can use to get all kinds of features, UI elements, UI layouts, add-on modules, interactions and much more. BootStrap and Foundation are the ones I have been accustomed to for a while, even though you can’t just categorize them into CSS frameworks, they are more of front end frameworks. Since a lot of people don’t have the time to only use the ready made CSS but then write the HTML and JavaScript separately, these BootStrap or Foundation types of frameworks are widely used to make it easier and faster. Now after being into this field for a while… I have realized that I shouldn’t get so comfortable with just one framework and not open up to the new and diverse kind of options available in the market today. Since now the criteria has become like the smallest CSS frameworks, lightweight CSS frameworks, modular CSS frameworks, extended CSS framework and much more, so I jumped into researching all kinds of CSS frameworks which are great based on different aspects.
So the new frameworks (some of them old as well) like Skeleton, Bulma, Gumby (which is now discontinued), Semantic, BluePrint, Pure etc. are worth trying for sure. Some of them claim (and maybe are) better than BootStrap as well. But my focus in this blog is to provide the detailed list of the best and the most lightweight CSS frameworks (not front-end framework) for designers and developers who are keen to keep their site is simple and light.
This blog is an upgrade to an old blog post I wrote on the
Best CSS Frameworks for Designers
1. Pure CSS
Created: Yahoo! Inc.
File Size: 3.8KB* minified & gzipped
Year Launched: 2013
Year Last Updated: 2017
Pure CSS Framework Features
- PureCSS builds on Normalize.css
- Loads of customization
- Allows custom download
- no JavaScript or jQuery
- Responsive i.e. can handle layout on all the devices.
- Provides an option to download non-responsive version also ( mobile specific or desktop specific )
- Provides layout and styling for native HTML elements, plus the most common UI components.
2. Furtive CSS
Created by: John Otander
File Size: 2.47kb gzipped
Year Launched: 2014
Year Last Updated: 2017
Furtive CSS Features
- Micro CSS framework
- good for novices / beginners, pretty easy to understand and use
- more focused on the mobiles
- works well with latest technologies like SVG and flexbox.
- no JavaScript or jQuery
- All the dimensions in rem
3. TOAST CSS grid
Created by: Daniel Eden
File Size: 7.11kb unzipped
Year Launched:
Year Last Updated: 2015
Toast CSS Features
- “insane, no-nonsense css grid”
- Only grid system
- It is best for managing content
4. Skeleton
Created by: Dave Gamache
File size: 11.2kb unzipped
Year Launched:
Year Last Updated: 2014
Skeleton CSS Features
- No javascript or jquery
- Lightweight and easy to use.
- Zero compiling and installation.
5. Siimple
Created by: Josemi Juanes
File size: 10.2 kb unzipped
Year Launched: 2015
Year Last Updated: 2017
Siimple CSS Features
- Flat design
- Clean code representation
- Built in SCSS/SASS
- 3 different projects (siimple, siimple-color and siimple-layout)
- (siimple & siimple-color) are available
- siimple-layout is comming out soon
Download Siimple CSS
6. Milligram
Created by: CJ Patoilo
File Size: 2kb gzipped
Year Launched: 2015
Year Last Updated: 2017
Milligram Features
- Minimal design concept
- Fast and clean code
- Focuses on higher productivity and better performance
- More functionality and minimal design
7. Spectre.css
Created by: Yan Zhu
File size: 10kb gzipped
Year Launched: 2016
Year Last Updated: 2017
Spectre.css Features
- Lightest, Responsive and Modern
- All features needed with latest technology
- Flexbox with responsive layout
8. Layers CSS
Created by: Jerry Jäppinen
File size: 7.6 kb minified and gzipped
Year Launched: 2015
Year Last Updated: 2017
Layers CSS Features
- Built your own look on web not twitter’s look
- Normalization and sensible are default
- no px, color or border pre defined.
- Good documentation visual representation
9. Mini.CSS
Created by: Angelos Chalaris
File size: less than 7kb gzipped
Year Launched: 2016
Year Last Updated: 2017
Mini.css Features
- Minimal, responsive and style agnostic
- Infinitly customizeble
- It works with all browsers but not all versions
- It stands between micro and full featured framework
10. Bulma
Created by: Jeremy Thomas
File size: 184kb unzipped
Year Launched: 2016
Year Last Updated: 2017
Bulma CSS Framework Features
- Modern css framework
- Needs only one css file
- Works with node js
- Built on flex box technology
11. Bijou
Created by: Jacob Hart
File size: 2kb gzipped
Year Launched: 2014
Year Last Updated: 2014
Bijou CSS Framework Features
- Beautiful CSS framework
- It offers Grid, Typography, Tables, Buttons and alert
12. Base
Created by: Matthew Hartman
File size: 2kb gzipped
Year Launched: 2014
Year Last Updated: 2017
Base CSS Framework Features
- Builts mobile first to ensure works on all device
- Solid Foundation
- Built on normalize 4
- Cross Browser support
- Modular Core
- Automation Sensation
- Base is very easy to learn and use
13. IceCream
Created by: Zied Hosni
File size: uncompressed 2.9kb, minified 1.8kb
Year Launched: 2013
Year Last Updated: 2013
IceCream CSS framework Features
- It only has grid system nothing else
Download IceCream
14. Dead Simple Grid
Created by: Vladimir Agafonkin
File size: 250 bytes
Year Launched: 2013
Year Last Updated: 2016
Dead Simple Grid Features
- Responsive css grid
- It is micro framework
- Contains only two class row and color
- Fluid columns with fixed gutters
15. Simple Grid
Created by: Dallas
File size: 3.63 kb
Year Launched: 2014
Year Last Updated: 2016
Simple Grid Features
- Responsive CSS grid system only
16. Concrete
Created by: David Lumley
File size: 2402 bytes unzipped and 709 bytes gzipped
Year Launched: 2015
Year Last Updated: 2015
Concrete Features
- simple, responsive, ultra lightweight twelve column grid framework
- It is designed to be easy, simple and small
17. Cardinal CSS
Created by: Chris Bracco
File size: 11.27 kb gzipped
Year Launched: 2013
Year Last Updated: 2016
Cardinal CSS Features
- It is modular css framework built with performance and scalability in mind
- Sensible global styles and useful mixins
- Flexible grid system encapsulated styles
- easy, simple and small