100+ Best CSS Frameworks for Responsive Design
A CSS framework is a collection of CSS files containing predefined rules for layout, typography and other CSS resets. if you are a developer you might hear of terms like boilerplates, grid systems etc. Each one of them promising more than the next one. For the most part, they all refers to a collection of assets that are design to speed up the development.
CSS frameworks focused on responsive web design aspects. CSS framework cover all area of a responsive web development like typography, user interface layout etc. A good CSS framework may contain a grid system, Typography styles, CSS resets, layout models, responsive media and browser fixes. You don’t need to write a code from scratch, frameworks will provide codes for basic elements.
The main advantages of using a CSS framework are,
- It saves a lot of time in the development process especially psd to html and css.
- They are famous for browser compatibility.
- CSS frameworks promotes grid system.
- Great for responsive web design.
- It helps to learn css.
There are many popular front-end frameworks are available like bootstrap and foundation. That doesn’t. Mean they are only the best solution. Here we have put together the best collection of CSS frameworks. We have listed the best and useful frame works available based on their popularity and ease of use.
A lightweight, progressive, high-IQ CSS framework.
minstyle.io is a simple and light open source CSS framework. It integrates a set of pre-designed HTML elements, allowing the rapid and simple development of interfaces for all devices.
BuddyCSS is a simple CSS framework to build awesome websites easily.
The responsive CSS animation framework for creating unique sliders, presentations, banners, and other step-based applications.
Gumby CSS Framework
Gumby Framework is a flexible, responsive CSS Framework, Powered by SASS. Create rapid and logical page layout and app prototypes with a flexible and responsive grid system and UI kit.
The world’s smallest (995 bytes) responsive web design framework.
Office UI Fabric Core
The front-end CSS framework for building experiences for Office and Office 365.
Wing CSS Framework
A beautiful CSS framework designed for minimalists.
A lightweight, scalable, mobile-first, Simple CSS framework.
A beautiful responsive web design framework under 2kb (minified and gzip).
Smart CSS Grid
Smart CSS Grid is css grid layout based fluid responsive layout system with 12 columns.
A package based CSS framework.
Boba CSS Framework
A lightweight, modular CSS framework.
Alto Design System
UX guidelines, HTML/CSS framework, and React components working together to craft exceptional experiences at beqom.
The less formal CSS framework, with a quick and easy integration.
A lightweight responsive Sass/CSS framework based on flexible box.
Aione Framework is one of lightweight front end framework to make your HTML more beautiful. Aione Framework 1.0 stabled and flexible CSS framework.
It’s a flat, fast and powerful front-end framework for rapid web development.
A set of single-purpose CSS classes for scalable front-end development.
A CSS grid framework using Flexbox.
Petal is a modern, light CSS UI framework developed at Shakr.
A utility-first CSS framework for rapid UI development.
Amaze UI Mobile First CSS Framework
Amaze UI is a mobile-first and modular front-end framework.
Framy CSS Framework
Framy is a free and very simple css-only Framework for developing responsive & modern websites.
A micro (3kb) CSS framework.
Lightweight and scalable CSS Framework built for modern applications.
A colorful css framework made by a human not an Ai.
A minimal, responsive, style-agnostic CSS framework.
Web Grid is a CSS grid based Grid system for easy web development. The minified Grid CSS weighs less than a KB.
Sass/css lightweight framework, built for speed and performance.
Chopstick Design Framework
Chopstick is a mobile-first responsive design framework.
Superclean, powerful, responsive, Sass-based, BEM-syntax CSS grid system.
Bojler is an email framework for developing responsive and lightweight email templates that will render correctly across each of the most popular email clients.
Free, simple, responsive CSS framework built in LESS and easy to customize.
A design system and functional CSS framework.
WIP – minimal wireframing css-framework.
Turretcss is a styles and browser behaviour normalisation framework for rapid development of responsive and accessible websites.
Feather CSS framework
Neckbeard is an Atomic CSS in JS Framework.
Vanilla Framework is a simple extensible CSS framework, built using Sass and is designed to be used either directly or by using themes to extend or supplement its patterns.
Baseui is a very limited CSS framework. baseui tries to provide you with a minimal style setup that you can build upon.
A website development framework built with Grunt and Sass, and incorporating jQuery UI.
15 KB feature-rich front-end framework.
USkin is a front-end framework which provides stunning web components based on CSS3 and ReactJS.
Based is a barebones CSS framework for prototype or production. Based features an extensive flexbox grid system and OOCSS classes that don’t make assumptions about your application’s styles or override any browser defaults.
Herocss is a lightweight, responsive css framework. Herocss includes a working drop-down menu without dependencies.
A CSS grid framework based on Flexbox.
Sirius UI is a Flexible CSS Framework based on Flexbox and VueJs.
A very simple CSS framework to simplify the lives of web designers. Less typing, more drinking juice.
A fully responsive CSS and UI framework with custom design controls and simplistic structure. A components are customizable and work with your CSS.
Bootplus is a front-end framework for faster and easier web development inspired by the lates Google+ look & feel.
Caramel is a simple, modern, responsive website framework. Caramel is fully responsive, meaning you only need to write code once, to have the same results across multiple platforms.
A well structured top down base css framework.
Clarity Design System
Project Clarity is an open source design system that brings together UX guidelines, an HTML/CSS framework, and Angular 2 components.
A beautiful CSS library to kickstart your projects.
A powerful CSS framework boilerplate and Bootstrap 4 themes builder.
Yo Mobile First strategy is based on the design, development and use Sass CSS Framework, includes a lightweight, easy to use, configurable, strong expansion and other characteristics, but also adapted to the PC side of the advanced browser.
Simple and complete web UI framework to create web apps with Windows 8 Metro user interface, based on Bootstrap 2.
Bobril wrapper of the most popular HTML, CSS, and JS framework for developing responsive, mobile first projects on the web – Bootstrap.
Beard is an extremely pragmatic and utility-focused CSS framework.
A CSS / LESS Dashboard UI framework created for Websilk, a drag & drop web development platform.
Orion is a mobile-first HTML/CSS/JS framework. It’s a simple, easy to use and quick way of getting your responsive web project off the ground.
Intuitive, easy to use, mobile first CSS framework based on Flexbox.
Dead simple CSS framework.
A sassy, opinionated CSS Framework. A tiny alternative to Bootstrap.
Spectre.css is a lightweight, responsive and modern CSS framework for faster and extensible development.
A lightweight, unobtrusive and style-agnostic, CSS framework aimed for practical use cases.
Open source modular CSS framework providing great structure for building websites quickly.
Cardinal is a modular, mobile-first CSS framework built with performance and scalability in mind.
A forward-thinking, lightweight, CSS microframework.
A minimally invasive CSS framework for modern web applications.
A Material Design CSS only framework.
SMaterial the Googles Material Design inspired CSS framework.
Bulma CSS Framework
A modern CSS framework based on Flexbox.
Milligram is a minimalist CSS framework. Milligram provides a minimal setup of styles for a fast and clean starting point.
A scss framework based on a variety of other frameworks.
A new Stylus based CSS framework for those who love beautiful things.
Open Source Modular CSS Framework. Blaze is designed to give you structure and a good starting point for your website.
Although the overall look and feel are most definitely inspired by Twitter Bootstrap, Cascade framework is not just another Bootstrap clone.
Baseguide is a lightweight and robust CSS framework powered by Sass. It brings together all essential base components in a small yet powerful package.
Stab CSS Framework
Responsive CSS framework focused on agility, grids, page design and mobile first.
Siimple is a minimal CSS framework for flat and clean websites.
A minimalist themable CSS framework.
Meshki is a simple, black-colored, responsive boilerplate to kickstart any responsive project.
Bodoke is a CSS/SCSS Front-end Framework created for supporting multiple grids in a single project. With a minimum of design, it’s visually clean from the scratch ready to be designed with your own identity.
Locaweb Style is a framework with CSS and JS patterns to build products admin interface.
Agile CSS is a modern web framework specifically designed for building extensible and flexible Web UI for applications.
The Ice Framework is a modifiable and reusable system that can provide a basic structure for implementing fluid and accessible websites.
Sculpt is a free lightweight, mobile first, responsive HTML, CSS (and SASS) framework.
A CSS Framework based on Material Design made simple, for Ember.js apps.
Essence is a CSS framework that implements the guidelines from Google Material Design Specification using Facebook’s react.js library. Use it to easily build super-fast and great looking web & mobile interfaces.
Material Framework is a simple responsive CSS framework made by Tim Nguyen that allows you to integrate Material Design in any web page or web app.
A CSS framework based on Google’s material design.
Assembly is an open source CSS framework that makes the hard parts of designing for the web easy.
Materialstrap is a HTML and CSS framework written from scratch built on the principles of Bootstrap but with the modern and sleek Material Design style.
A lightweight CSS framework based on Google’s Material Design.
Design elements, playground and code snippets for Bootstrap HTML/CSS/JS framework.
Cluckles Live Theme Editor for CSS Framework based on Less such as Twitter Bootstrap.
KNACSS is like a CSS style sheet “reset” on-vitamin that can start a project from scratch, taking into account general good practice (accessibility, performance, responsive webdesign).
Concise is a lightweight, front-end framework that provides a number of great features without the bloat. Concise is built based on Object-Oriented CSS principles and keeps semantics in mind to provide a small learning curve, and a high level of customization.
Bootstrap is a sleek, intuitive, and powerful front-end framework for faster and easier web development.
Foundation is the most advanced responsive front-end framework in the world. You can quickly prototype and build sites or apps that work on any kind of device with Foundation, which includes layout constructs (like a fully responsive grid), elements and best practices.
Semantic is a UI component framework based around useful principles from natural language.
UIkit is a lightweight and modular front-end framework for developing fast and powerful web interfaces.
Wee: Front-End Framework
Metro UI CSS
The front-end framework for developing projects on the web in Windows Metro Style, created and supported by Sergey Pimenov (aka olton) with the massive support and involvement of community.
MUI – Material Design CSS Framework
MUI is a lightweight HTML, CSS and JS framework for sites that follow Google’s Material Design guidelines.
TukTuk is a responsive front-end framework that creates extensible sites easily.
Lightweight, more intuitive and useful responsive CSS framework. Responsee is an open source responsive CSS framework based on 12-column grid. Websites based on Responsee are fully responsive – they display content correctly on each type of devices.
960 Grid System
The 960 Grid System is an effort to streamline web development workflow by providing commonly used dimensions, based on a width of 960 pixels. There are two variants: 12 and 16 columns, which can be used separately or in tandem.
Skeleton is a simple, responsive boilerplate to kickstart any responsive project.
Kube Web Framework
Kube is one of the world’s most advanced and flexible frameworks. Kube helps you spend less time on routine tasks and more time creating amazing products. Focus on success, and Kube will cover the technology behind it.
Less Framework is a CSS grid system for designing adaptive websites. It contains 4 layouts and 3 sets of typography presets, all based on a single grid.
Web boilerplate stack (HTML5, CSS3, jQuery, and PHP). G5Framework provides some rock-solid code and functionality for you to start with, however it leaves all the remaining development and styling up to the developer.
Blueprint is a CSS framework, which aims to cut down on your development time. It gives you a solid foundation to build your project on top of, with an easy-to-use grid, sensible typography, useful plugins, and even a stylesheet for printing.
YAML CSS Framework
YAML (Yet Another Multicolumn Layout) is a modular CSS framework for truly flexible, accessible and responsive websites. YAML is focussed on device independent screen design and provides bullet-proof modules for flexible layouts. This is a perfect starting point and the key to truly responsive design.
BlueTrip CSS Framework
A CSS grid-based framework born from the best parts of other frameworks, now with a life of its own.
First HTML5 and CSS3 framework.
Elastic CSS Framework
A simple css framework to layout web-based interfaces, based on the printed layout techniques of 4 columns but with capabilities to unlimited column combinations. and capacity to make elastic, fixed and liquid layout easily.
Baseline is a framework built around the idea of a “real” baseline grid.
A set of small, responsive CSS modules that you can use in every web project.
Cascade Framework Light
A CSS micro-framework based on Cascade Framework.
An HTML5/CSS3 framework used at SAPO for fast and efficient website design and prototyping.
Kule CSS lazy
Kule is a CSS framework, working for reducing duplicate CSS design during development.
Responsive Grid System
The Responsive Grid System isn’t a framework. It’s not a boilerplate either. It’s a quick, easy & flexible way to create a responsive web site.
A modern responsive front-end framework based on Material Design.
Schema UI Framework
Schema is a modular, responsive, front end framework to easily and quickly help you jumpstart your process in building complex interfaces for the web right out the box.
Kathamo CSS Framework
Kathamo is a Minimalist CSS Framework for Rapid & Mobile-Friendly Development. Kathamo has a few easy ways to quickly get started, each one appealing to a different skill level and use case.
Unsemantic CSS Framework
This is a fluid grid system for mobile, tablet, and desktop.
Tacit CSS Framework
Tacit is a primitive CSS framework for dummies, like myself, who don’t know anything about graphic design but want their web services to look eatable. No classes, no layouts. Just design plain and simple web pages compliant with HTML5 and they will look OK.
A Sass-based Responsive CSS framework. spaceBase is the front-end starter files for any new web project. It sets up your Sass architecture and normalizes your CSS and native HTML elements. It provides the structural groundwork for your application.
A super simple, responsive framework built for all devices big, small and in-between.
Compass is an open-source CSS Authoring Framework.
The responsive CSS web framework.
Simple, Flexible, & Powerful responsive web framework, Makes your web development faster and easier. It takes you all the way from 1200px on down to 320px.
Minimalistic but flexible and powerful SCSS / CSS framework.
Centurion is a responsive framework built for speed, simplicity, and flexibility.
A lightweight front-end framework for creating scalable, responsive sites.
SkyBlue CSS Framework
SkyBlue is a minimal framework that is meant to be starting point for my projects.