Style combination · Pairs well
GOV.UK Design × Penguin Paperback Design
Both are British systems that set one sans in fixed positions on white and let rules build the hierarchy; GOV.UK refuses pictures and gives each colour one job, so borrow Penguin's one colour per series when a text-led service has to sort many sections at a glance.
Mix them and make something GOV.UK Design Penguin Paperback Design
01
What each style brings
Each part of the design comes from the style with the stronger say in it, and each style gives at least two.
GOV.UK Design (GDS Style) Penguin Paperback Design (Three Bands to the Marber Grid)
- Type from Penguin Paperback Design
- Colour from Penguin Paperback Design
- Form from GOV.UK Design
- Composition from Penguin Paperback Design
- Surface from GOV.UK Design
02
The type
Open fonts standing in for each style’s own type, which is often hand-drawn or commercial.
Display · Penguin Paperback Design
Order
Fira Sans, standing in for Gill Sans (Eric Gill, Monotype: author and title on Edward Young's 1935 banded cover, kept with much improved letterspacing in Tschichold's reform)
Text · GOV.UK Design
The text-led design of GOV.UK, the UK government's single website, built by the Government Digital Service from 2012 and codified in the GOV.UK Design System (2018). Pages are white, with the main content in a two-thirds column set flush left and in sentence case in GDS Transport, a cut of Kinneir and Calvert's road-sign lettering, in two weights. Pictures and icons are avoided. Size, weight and thick rules build the hierarchy, each colour has one job (yellow marks only keyboard focus), and services ask one question per page.
Inter; GOV.UK Design used GDS Transport and Transport, the British road-sign lettering by Jock Kinneir and Margaret Calvert (1957-1963), from which New Transport descends
03
The colours
The ground and leading colours come from Penguin Paperback Design, with a counter-accent from GOV.UK Design. The ink reads on the ground at 4.5:1 or more.
GOV.UK Design (GDS Style) Penguin Paperback Design (Three Bands to the Marber Grid)
-
#f6f3eaground · 36% -
#1a1a1aink · 14% -
#ef7d22accent · 18% -
#1d70b8accent · 14% -
#c8285faccent · 10% -
#2f8a4eaccent · 8%
As CSS
:root {
--ground: #f6f3ea;
--ink: #1a1a1a;
--accent-1: #ef7d22;
--accent-2: #1d70b8;
--accent-3: #c8285f;
--accent-4: #2f8a4e;
--font-display: "Fira Sans", sans-serif;
--font-text: "Inter", sans-serif;
}Use it with care
GOV.UK Design (GDS Style): GOV.UK's branding belongs to the UK government's own services. The Design System tells services that are not part of GOV.UK to replace its branded assets, use a header without GOV.UK branding, use an alternative to the GDS Transport font and drop the GOV.UK brand blue. Borrow the approach, not the identity, and never make a page that could pass as an official government service.
Penguin Paperback Design (Three Bands to the Marber Grid): The Penguin name and penguin symbol belong to the publisher, which still reissues its classic grid covers, and many cover photographs and drawings remain in their makers' copyright: draw your own emblem, do not combine an orange or green three-band cover with a bird emblem and a publisher cartouche so that it passes for Penguin, and never present a new design as a Penguin book.
04
The two styles
05
More combinations
With GOV.UK Design
- International Typographic Style Pairs well · Swiss flush-left grotesque setting and grid discipline give the same rational base; use it for printed and signage material that should read as the same voice.
- Corporate Memphis Contrasts · Corporate Memphis fills screens with flat cartoon people, which GOV.UK's guidance asks services to avoid; one reaches for friendliness through illustration, the other for inclusiveness through plain text.
- Flat Design Contrasts · Flat design leads with icons, tiles and bright colour fields; GOV.UK removes them and lets words and rules do the work. Compare both when deciding whether an icon helps or only decorates.
- London Transport Design Pairs well · Another British public system held together by fixed constants (one typeface, one emblem, a few colours); borrow its commissioned posters for campaigns that sit outside the plain service pages.
- Plain Tobacco Packaging Pairs well · Another state system of fixed constants where each colour has one job; borrow its plain wording and one-message-per-surface discipline for the leaflets and screens that sit around a health warning.
- British Road Signage (Kinneir & Calvert) Pairs well · GOV.UK sets a descendant of the same lettering, GDS Transport (reserved for its own services), flush left on white screens without the colour code or pictograms; pair the two when a public service needs signs and screens to speak in one voice.
- Newsroom Data Graphics & Scrollytelling Pairs well · Both are plain public-information web design on a white column with colours that each have one job; set the charts inside GOV.UK-style plain-text pages for public data releases.
- Legible City Wayfinding (Heads-Up Pedestrian Maps) Pairs well · Civic, research-led and plain-spoken; pair the street maps with GOV.UK's plain screens for a public service that reads the same on the pavement and the phone.
With Penguin Paperback Design
- International Typographic Style Pairs well · Facetti and Marber already brought Standard and Helvetica, a rule and ranged-left type to the paperback; borrow a Swiss modular grid to extend the Penguin top strip into a full series system for books or podcasts.
- London Transport Design Pairs well · Both are British systems with a fixed emblem and a Johnston-to-Gill humanist sans; pair London Transport's commissioned pictorial art with Penguin's genre colour bands when one identity has to carry many varied items.
- Vicente Rojo & Mexican Editorial Modernism Pairs well · Rojo's Ediciones Era covers share the white ground, fine rules and one image in a fixed field; combine them for a literary list that needs both a rigid frame and grainy, two-ink photographs.
- Bengali Modernist Book Cover (Prachchhad) Contrasts · Contemporary opposites in literary covers: Signet Press drew a new hand-lettered title for every book, Penguin set the same typeface in the same place on every one; choose by whether the series or the single title should lead.
- Hauntology & Ghost Box Design Contrasts · Ghost Box quotes the ruled Penguin band over a saturated field as an eerie, ironic memory; use the original when the template should simply sort and sell books, and Ghost Box when it should haunt.
- Giallo Mondadori Covers (I Libri Gialli) Contrasts · Penguin coded crime with green bands and type only; Mondadori coded it with yellow and a painted window. Borrow Penguin's fixed type positions to tidy a giallo template, or a painted window to warm a banded one.
- Book Blob (Abstract Colour-Blob Literary Fiction Cover) Contrasts · Penguin's bands and grid made every book look like its publisher on purpose. The blob made books from rival houses look like one another, so the cover signals comparable titles rather than an imprint. Borrow a house grid when a series identity should outlast the season's trend.
- Pulp Magazine Cover Pairs well · The paperback cover is the later successor on the newsstand and bookstall; it trades the shouting masthead and painted peril for a restrained, systematic cover.