Documentation
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 guardian.co.uk, 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.
Hosting
Pasteup is fully hosted on http://pasteup.guim.co.uk 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
- Looking for boilerplate HTML?
- Looking for HTML coding styleguide?
- Looking for CSS coding styleguide?
- Looking for JavaScript coding styleguide?