Here is a quick comparative analysis of a lot of CSS frameworks. Some of them are quite minimal and only offer a way to layout your components in a grid (unsemantic, fluidable). Others give it to you whole and offer a grid layout, a CSS reset, icons and styles for all the components you'll want to display (Bootstrap, Foundation, UIkit).
I have used or would be happy to use any of the five frameworks I linked to above. My notes on these and other frameworks are below.
If you would like to quickly try it out for yourself, feel free to clone this git repository and fiddle with the file index.html
for each framework.
Also, see this cool chart for a quick overview of all the frameworks.
Pros:
- Simple to use
- Images and icons and widgets
- Large user base
- Good documentation
- Usable
Cons:
- A lot of extra html needed
Pros:
- Good doc
- Lots of widgets
- Icons, though separate from the main release
- Advanced layout options
- SCSS
Cons:
- Default styling not so usable
- Layouts can get complex
Pros:
- Advanced layouts
- Icons
- Javascript stuff
- Minimal looks
- Good doc
Cons:
- Lots of classes to add
Pros:
- Simple and small
- Some icons
- Responsive layout
- Fairly good documentation
Cons:
- No stylings for things like headers and action buttons
- Strange class names
Similar to Knacss. Documentation lacking.
Pros:
- Simple to use
- Some widgets like insets and blockquotes and buttons and lightboxes
Cons:
- Documentation looks weak
- No images
- Not lots of widgets
Pros:
- Advanced layouts with simpler alternatives if the 12-column layout is not needed
- Lots of widgets
- Sass
- Some icons
Cons:
- A lot of classes required + unclear conventions for class names
- Not lots of icons
- Lots of files to include to get started
Pros:
- Minimal
- Styles a lot of things by default
- Very simple to use
Cons:
- No widgets
- No icons
Pros:
- Minimal
- Easy to use
Cons:
- Nothing but a grid layout (could be a pro too)
Pros:
- Has widgets and icons and stuff
- Good documentation
- Easy to use and customize
Cons:
- Weird classes for buttons
- Strange UX choices (default style hard to read or icons in the wrong place)
A minimal grid-only framework.
Not tested.
Looks good. Has widgets and icons and other things.
Not tested.
Has lots of stuff. Documentation and default theme look quirky.
Not tested.
Looks good. Has grid, typography and forms but no widgets or icons.