Brad Frost @ #btconf

Written by on in Düsseldorf, Germany.

“Atomic Design” - notes from Brad Frosts talk at Beyond Tellerrand 2013.

We understood that designs are no longer pixel-perfect. We design no longer screen pages but a series of compounds. Some solutions:


Pattern Gallery, ui parade, and responsive patterns try to solve some problems of the multi-device era.


These things are awesome but they are


Atomic Design

Atoms (HTML elements)

Molecules (modules)

Organisms (site snippets like header, footer, navigation etc.)



Everybody benefits: the client sees something. Creators are actually creating the product. When reviewing pages atoms remain the reference point for the pages.

Introducing Pattern Lab

A collection of tools to help create and maintain atomic web design systems.

What it is:

What it’s not:


Atomic design from Brad Frost