This article was published 8 years ago, therefore the contents of this post may be out of date.

Frameworks, you can either hate or love them, but you can’t ignore them, as when it comes to Front-end frameworks, many do disproved their existence.

Using a framework are great start for creating beautiful, responsive and cross-browser friendly sites quickly & easily without the need to learn a lot of code.

While Bootstrap & Foundation are the two of the more popular front-end frameworks and the first two that most people recommend.

This post isn’t about them, this post is here to show you that there are other great frameworks out there, and many of these frameworks, you probably haven’t heard of yet.

1. Pavilion


Created a few month ago, Pavilion was created out of the need for a simple, unopinionated CSS framework, ready for the future.

Pavilion is built for front-end web developers who tend to never use the hundreds of pre-made UI components some frameworks ship with. As it been built for front-end developers who lean towards creativity, exploration and creating UI components themselves from the ground up whilst depending on a solid foundation with future-proof capabilities.

The idea is that pre-made UI elements never really suit your needs for 100%. You’ll end up customising them anyway. Pavilion lays down the groundwork and the rest is up to you.

2. StringBean


StringBean is a featherweight responsive CSS Framework based on a 24-point system, rather than the traditional 12-point system that you seen on other frameworks.

As sometimes, 12 is just too few, especially on a high resolution screen, such as 4K – at 4K String Bean comes into its own!

StringBean gives the developer the power to divide the screen up in more finite segments providing you with greater control over the widths of content on your site, especially at higher resolutions (think HD & UHD (2K, 3K, 4K, and above).

StringBean also has 6 breakpoints, instead of the traditional 4, so you can implement your design with: xsmall-*, small-*, medium-*, large-*, mega-hd-*, and mega-uhd-*.

3. Cutestrap


A sassy, opinionated CSS Framework. Cutestrap is a tiny alternative to Bootstrap. Cutestrap supports Vertical Rhythm, consistetn pattern for form fields, smart defaults for all default elements CSS specificity is very low in the class hierarchy which is configurable.

Cutestrap is a solid foundation for a living styleguide using KSS plus it is minified at only 8kb.

4. Spectre.css


Spectre.css is a lightweight, responsive and modern CSS framework for faster and extensible development.

It’s a lightweight and clean starting point for you and your project or prototype. Spectre is carefully designed with it’s useful components and utilities.

Spectre is a side project based on years of CSS development work on a large web service project. It’s only includes modern base styles, responsive layout system, CSS components and utilities, and it can be modified for your project with LESS compiler.

5. Vital


Vital is a minimally invasive CSS framework for modern web apps. It comes in at just 6KB gzipped, with no JavaScript and vast device support.

Vital is built on the principal of less is more. Working with less code means there are fewer bugs to squash and less documentation to read. Less time spent coding means more time to focus on your next killer item.

6. Flexbox Grid


Flexbox Grid is a grid system that’s based on the flex display property. It’s responsive and fluid, with a simple syntax.

7. Hoisin.scss


Hoisin is a very simple Sass written, responsive front end mini framework made to kick start your web project.

This framework was created as an alternative to more complex and bloated front end frameworks, with a focus on organisation, speed and flexibility. It’s also been aim to keep its codebase fresh including new techniques, whilst maintaining good support for the most common browsers.

8. EtherCSS


EtherCSS provides a minimal setup of styles for a fast and clean start of your project. It is designed specially for high performance and top productivity with fewer properties to reset. The result is much cleaner code and less weight. Hope you enjoy EtherCSS!

9. BlazeCSS


Blaze CSS is an open source modular framework providing great structure for building websites quickly. Blaze fills the gap between monolithic frameworks like Bootstrap, UIKit and Semantic, and “micro” ones such as Skeleton, Milligram and Min.

10. Picnic CSS


Picnic CSS is a lightweight framework written in Sass, making it easier for you to edit and customise variables such as colors and lengths. It also has some impressive, purely-CSS UI components such as a modal window and a content slider.



10 Frameworks You’ve Never Heard Of