12 Useful CSS Frameworks

When building websites, designers tend to CSS frameworks.  Using a CSS framework helps eliminate the need to do repetitive work.  One of the most important aspects of designing a solid website is to have a clean grid structure.

960 CSS Framework

The 960 Grid System is known for helping streamline development workflow by providing a wireframe for commonly used dimensions based on a width of 960 pixels.  There are 12 column and 16 column variants here.

Blueprint CSS

The BluePrint CSS helps you cut down development time by giving you a solid foundation to build your project on top of an easy-to-use grid.


CleverCSS is a small markup language for CSS that was inspired by Python.  CleverCSS can be used to build a style sheet in a clean way.


Construct is a visual layout editor that is based on Blueprint and jQuery.

Elements CSS Frameworks

Element is a CSS framework that was built to help designers write CSS faster and more efficiently.

Fluid 960 Grid System

Fluid 960 Grid System is a CSS framework based on the 960 Grid System.  Fluid 960 Grid has a fluid 12-column, fluid 16-column, fixed 12-column, and fixed 16-column layout.

The jQuery UI CSS Framework

The jQuery UI CSS framework is designed for building custom jQuery widgets.  The framework includes classes that cover a wide array of common UI needs and can be changed around using jQuery UI ThemeRoller.


PXtoEM.com is a website that helps you convert pixels to EM sizes.

Schema Web Design Framework

Schema Web Design Framework has HTML/CSS settings that can be manipulated to accommodate any design type for the web.  This helps facilitate quick building of presentation layer HTML with useful layout and type stylesheets.

WYMstyle CSS Framework

WYMstyle is a CSS framework for designers to use to build websites faster.

YAML CSS Framework

YAML is a modular CSS framework used for flexible, accessible, and responsive websites.  It uses a flexible grid system and focuses on web standards and accessibility.  It has been used on Rolling Stone’s website.


Yahoo!’s foundational CSS Grids provides a simple system for laying out content.  Basic components are “grids” and “units.”

This article was written by Amit Chowdhry. You can follow me at @amitchowdhry or on Google+ at
Leave a Comment