Archive for the ‘License Free’ Category

Transitions in CSS3 brings many possibilities on animating and morphing HTML elements.

Lea Verou is sharing a beautiful experiment and resource –Animatable– that showcases different CSS transitions (and how simple they are).

Each transition is applied to a box where you can activate by hovering them (or run the transitions for all items).

You can also click the items to easily see the "from" and "to" values of CSS properties changed.


Fluid Baseline Grid System is a starting point armed with various resources to be a starting point for creating HTML5-CSS3-powered websites.

It is built with typographic standards in mind with combining principals of fluid-column layouts, baseline grids and mobile-first responsive design into a resolution independent and device agnostic framework.

Fluid Baseline Grid System

The kit is packed with CSS normalization (while correcting bugs, fixing common browser inconsistencies and improving usability) and includes jQuery, HTML5 Shiv + Respond.js.

It enforces a lightweight, and non-obtrusive code which can be edited easily for every project. By default, it is based on a 3-column folding layout, 1 column for mobile devices, 2 columns for tablets and 3 columns for desktops and beyond.

Viget Inspire, "an inspiring blog which discusses web design standards, trends and techniques", has an experiment on the uses of CSS3 box shadows.

The article shares 39 original uses of "box shadows" and it is a great showcase of what can be accomplished with this CSS3 property.

In order to create the effects, some examples have multiple box shadows and make use of other CSS properties like :before/:after, transition, webkit-keyframes, text-shadow and background-image: gradient.

39 Box Shadows

Normalize.css is a set of CSS rules for forcing HTML elements to render more consistently across all browsers.

Compared to CSS resets, it doesn't reset all elements but leave the useful defaults and fixes various bugs.


The CSS file includes rules for a wide range of elements including the ones for HTML5 and well-documented (inline).

The developer mentions that Normalize.css shouldn't be an insert-and-forget resource, rather, it should be used as a customisable starting point on any project..

ProCSSor is a free web service for formatting and prettifying CSS files on the fly.

It can grab a CSS file by simply copy-pasting, uploading or mentioning the URL directly.

The service has many options to create an output that you'll feel ok with like "brace styles", right/left columns" or "indent properties".