Name | Hex or RGBA value | |
mobile-pink | #f54997 | |
air-aroma | #C7C7C7 | |
another-gray | #212020 | |
battered-gray | #323232 | |
black | #000 | |
canvey-mud | #343434 | |
carousel-gray | #2E2E2E | |
dark-gray | #111111 | |
dark-transparent | rgba(0, 0, 0, 0.8) | |
darker-gray | #1a1a1a | |
deep-gray | #262525 | |
definition-gray | #808080 | |
gray | #404040 | |
gudiance-red | #AF372A | |
gunship | #777 | |
iplayer-pink | #f54997 | |
light-gray | #dedddd | |
light-list-gray | #1e1e1e | |
light-transparent | rgba(52, 52, 52, 0.85) | |
lighter-gray | #474747 | |
list-gray | #555555 | |
madison-gray | #6b6b6a | |
metallic-gray | #4a494a | |
midnight-gray | #979797 | |
mist-gray | #353535 | |
not-quite-iplayer-pink | #cf3e80 | |
onnow-pink | #e92f83 | |
silver | #BDBDBD | |
slate-gray | #3B3B3B | |
tangerine | #ff9600 | |
unavailable-gray | #909090 | |
white | #fff | |
white-rock | #eee |
Links hover colour is iplayer-pink whereas buttons (or areas that get highlighted) are not-quite-iplayer-pink:
This is a link and
Breakpoint | Breakpoint description | Width range |
1 | Small phones | up to 400px |
2 | Regular phones | drom 401px to 600px |
3 | Small tablets and portrait iPads | from 601px to 1008px |
4 | Desktops and landscape iPads | from 1009 pixels onwards |
Background fade: dark-transparent
Background colour: Slate gray
Name | Colour |
Main brand colour | #ea2923 |
Name | Colour |
Main brand colour | #005761 |
Secondary brand colour | #B0DfDD |
Name | Colour |
Main brand colour | #3e1638 |
Secondary brand colour | #ff0d7a |
Name | Colour |
Main brand colour | #fff |
Secondary brand colour | #000 |
Blue brand colour | #468091 |
Name | Colour |
Main brand colour | #29c5fe |
Name | Colour |
Main brand colour | #bfd832 |
Secondary brand colour | #4e6919 |
Name | Colour |
Main brand colour | #990000 |
Name | Colour |
Main brand colour | #e61512 |
Secondary brand colour | #e22402 |
Gray brand colour | #2f1b05 |
Name | Colour |
Main brand colour | #003167 |
Secondary brand colour | #6f9ecd |