Pasteup is a library of code to help you implement the Guardian’s design and interaction patterns on the web. It can be used in various ways, most simply by linking directly to a CDN hosted version, or if necessary pulling individual modules into your own project’s build process.

Base CSS

The base CSS of Pasteup should give you a generic Guardian style design for your page. This includes standard fonts and font sizes, colors, and heading styles. This is the simplest way of using Pasteup, and should go some distance to giving you a Guardian look and feel.

You can see an example of how this might look in our styleguide.

Layout styles

Guardian web pages typically implement one of two grid systems. A 940px fixed width grid as on, and a liquid and responsive layout which works across devices from mobile and tablet up to desktop (this doesn't exist yet).

Module library

A set of stand-alone components which make up Guardian web pages. These should be entirely decoupled from any particular page or any particular layout.


Pasteup is fully hosted on which is a globally distributed and load balanced CDN. All files are minified, gzipped, and have far future Expires headers so they are aggressively cached by browsers.

In the first instance, please link to URLs on this domain, as they are likely to be already cached by your users.

Other things