Pure CSS: A 4KB CSS framework

A review of Pure CSS: a modern, lightweight and responsive CSS framework.

Pure: A set of small, responsive CSS modules that you can use in every web project.

Get started with one line of code:

<link rel="stylesheet" href="http://yui.yahooapis.com/pure/0.2.1/pure-min.css">

Get the latest version at purecss.io

Why Pure CSS?

Pure is rooted in the YUI library, a strong and established set of components backed by Yahoo. It contains well tested code for normalisation and cross browser compatibility. Pure also has a set of components for you to work with all the features you would expect from a CSS framework: grids, buttons, forms, tables and menus.

Where it stands out is its minimal footprint. At time of writing, the entire framework weighs in at 4.3KB when served to end users. The intention is that you use this base set of components and customise them to your needs, rather than using the defaults. Pure strikes a balance between preventing reinventing the wheel and not using a default set of components that will make your site look too similar to every other site using the same framework.

Pure CSS vs Twitter Boostrap

In short, Bootstrap does too much, and comes with a heavy footprint. It has its uses for rapid development, but this should be limited to quick and dirty admin interfaces, wire-frames and prototypes. Pure CSS provides a minimal framework for you to work from and style to your tailored needs. Pure CSS will take care of browser compatibility and provide a base set of components.

I will detail my reasons for avoiding Twitter’s Bootstrap on production sites later on.

Share and Enjoy

  • Facebook
  • Twitter
  • Google Plus
  • LinkedIn
  • Reddit
  • Pinterest

Leave a Reply

Your email address will not be published. Required fields are marked *