Most of the web designers should heard about “CSS Framework”, and I believe some of you had tried them before.

Just like other programming and scripting language, CSS do have some repeat code that can be packed together to ease our daily job.

When use properly, CSS Framework may cut down your development time. On the other hand, it may cause extra works and time if you choose the wrong framework for your project.

There are a lot of open source CSS Framework, and you can easily reach them by using Google. Today, I am going to show you 10 promising CSS Framework that worth a look.

    1. Blueprint: A CSS Framework

      Blueprint includes a CSS reset that eliminates the discrepancies across different browsers. There are a lot of external tools and templates to aid your web development with Blueprint.

    2. 960 Grid System

      Another excellent CSS Framework that worth a look. The download includes templates for Fireworks, Photoshops, Inkscape and etc. so that you can start designing your web template immediately. The PSD file that comes with guides ready save designers a lot of time.

  1. Tripoli Framework

    Tripoli had been tested and supports virtually all available browsers, including IE5! It comes with some base files, and some plugins such as “Layout”, “Visual”, “Type”, and “Negative”.

  2. YAML – Yet Another Multicolumn Layout

    YAML is another bulletproof CSS Framework that has a very good documentation. You can easily get started by downloading the PDF documentation and the sample project from the official site. There are some tools that will help you on your development too. For example, the YAML Builder can visually create YAML-based CSS layouts.

  3. YUI Grid CSS

    YUI Grids CSS support fluid-width layouts as well as fixed-width layouts. This is the advantage of YUI Grids CSS over the other CSS Frameworks. To get started with YUI Grids CSS, you can download the cheat sheet and YUI Grids Builder from the official site.

  4. BlueTrip

    BlueTrip is a full featured and beautiful framework that combines advantages from different CSS Framework. The official site has a complete documentation and demos.

  5. Content With Style

    This is a fixed width layout and the zip files contains a few layouts such as vertical navigation with 1 content column, vertical navigation with 2 content columns, and etc.

  6. Elastic CSS Framework

    Elastic provides a declarative language to define the layout structure and behavior. This is a young framework, and the best site to demo the usage of Elastic is the official site itself.

  7. Molio CSS/HTML Templates

    Mollio was launched since IE7 exposed a few rendering problems. It is a starting point for website layout and very suitable for beginners that start learning CSS Frameworks.

  8. SenCSS

    SenCSS doesn’t include a layout system, but it does provide other things such as baseline, fonts, paddings, margins and more. It comes with a commented version and a minified version which suitable for production use.

Some other CSS Framework that you may consider too

  1. WYMstyle
  2. CSS-boilerplate
  3. Typogridphy
  4. CleverCSS
  5. Logicss


Choosing a right CSS Framework is the most important step. I used both Blueprint and 960 framework regularly and now i start to combine the advantages of both framework and try to come out with a framework that suit me. So how about you, my dearest readers?