UKPOL CSS

A CSS template for UK political parties, Executives and Government Department web colours.

This is accurate as of 1st August 2014, with department colours being taken from gov.uk, Party colours being taken from party brand guidelines and Executive colours being taken from a mix of brand guidelines and their websites. Some of the fonts are licensed - so only freely available fonts are used below. If you notice any errors, feel free to tweet me: @pmrourkie or e-mail me: rich [at] richardallen.co.uk

Download Cheat Sheet

Created by @pmrourkie and under a Creative Commons Attribution-ShareAlike 4.0 International License

Star Fork Download

Get Started

It's pretty simple to use this, just follow the below to get going;

1. Download ukpol.css and copy it to your /css folder

2. In the <head> of your site reference ukpol;

<link rel="stylesheet" href="path/to/ukpol/css/ukpol.css">

3. Check out the examples below!

Example Use

Below is an example using buttons. The class is set to the desired department/party, class="n", within the <btn> tag

<btn class="parliament">

Parliament House of Commons House of Lords

And here, creating a div with the class set as one of the main political parties.

<section class="conservative-main"> Some Example Text </section >

The Conservative Party, colloquially referred to as the Tory Party or the Tories, is a centre-right political party in the United Kingdom that states that it espouses the philosophies of conservatism and British unionism

The Labour Party is a centre-left political party in the United Kingdom. It grew out of the trade union movement and socialist political parties of the nineteenth century and has been described as a broad church

The Liberal Democrats are a social-liberal. political party in the United Kingdom. The party was formed in 1988 by a merger of the Liberal Party and the Social Democratic Party (SDP).

Cheat Sheet

Political Parties

Party	Main	Second
Conservative Party	.conservative-main	.conservative-second
Labour Party	.labour-main	.labour-second
Liberal Democrats	.libdem-main	.libdem-second
UKIP	.ukip-main	.ukip-second
Scottish National Party	.snp-main	.snp-second
Green Party	.green-main	.green-second
Plaid Cymru	.plaid-main	.plaid-second

Executives

Executive	Main	Second
Parliament	.parliament
House of Commons	.house-of-commons-main	.house-of-commons-second
House of Lords	.house-of-lords-main	.house-of-lords-second
Scottish Government	.scottis-gov-main	.scottish-gov-second
Scottish Parliament	.scottish-parl-main	.scottish-parl-second
Welsh Government	.welsh-gov-main	.welsh-gov-second
Welsh Assembly	.welsh-ass-main	.welsh-ass-second
Northern Ireland Executive	.ni-exec-main	.ni-exec-second
Northern Ireland Assembly	.ni-ass-main	.ni-ass-second

Uk Government Departments

Department	Main
Treasury	.treasury
Cabinet Office	.cabinet-office
Attorney General's Office	.attorney
Department for Education	.education
Department for Transport Government	.transport
Home Office	.home-office
Department of Health	.health
Ministry of Justice	.ministry-of-justice
Ministry of Defence	.ministry-of-defence
Foreign & Commonwealth Office	.foreign-and-commonwealth-office
Department for Communities and Local Government	.dept-for-communities-and-local-gov
Department for Energy and Climate Change	.dept-for-energy-and-climate-change
Department for Culture, Media and Sport	.dept-for-culture-media-and-sport
Department for Environment, food and rural affairs	.dept-for-environment-food-and-rural-affairs
Department for Work and Pensions	.dept-for-work-and-pensions
Department for Business, Innovation and Skills	.dept-for-business-innovation-and-skills
Department for International Development	.dept-for-international-development
Office for the Advocate General for Scotland	.advocate-general-scotland
Scotland Office	.scotland-office
UK Export Finance	.export-finance
Wales Office	.wales-office