HTML5 Components Patterns is a free toolkit that aims to bring web design and development together. Show me!

What is Patternslib?

Patternslib, or short 'Patterns' lets you create rich, dynamic and interactive prototypes or websites, without having to know or care about Javascript.

Instead, you simply add special CSS classes and HTML5 data attributes to your HTML. These classes and attributes describe "interaction patterns", which add rich functionality to your page.

Patterns is both a library of reusable interaction patterns as well as a small framework for creating such patterns.

The stock Patterns

Patterns comes with a number of stock Patterns, which will be enough to create most sites with. Are you looking for a Pattern that's not here, or that cannot be created with a combination of the available stock Patterns, then read the section Creating a Pattern.