# Signal pop — palette recipe

## The idea

- Loud, saturated magenta and sunshine yellow on clean white, for brands that want to be noticed in a crowded feed and sound confident doing it.
- Mood: bold, playful

## Use it for

- Event and festival sites
- Launches and campaigns
- Products aimed at a young audience

## Avoid it when

- The subject is serious, such as health or money worries
- People need to read for a long time

## Colours

- Clean white (background): #ffffff
- Pale sun (surface): #fff3d1
- Night ink (text): #15121f
- Dusk grey (muted): #4a4659
- Hot magenta (accent): #c8104f
- Sunshine (accent-2): #ffd21f
- Bold outline (border): #15121f

## Accessible pairs

- Bold outline on Clean white — 18.5:1 (AA)
- Clean white on Bold outline — 18.5:1 (AA)
- Clean white on Night ink — 18.5:1 (AA)
- Night ink on Clean white — 18.5:1 (AA)
- Bold outline on Pale sun — 16.7:1 (AA)
- Night ink on Pale sun — 16.7:1 (AA)
- Pale sun on Bold outline — 16.7:1 (AA)
- Pale sun on Night ink — 16.7:1 (AA)
- Bold outline on Sunshine — 12.7:1 (AA)
- Night ink on Sunshine — 12.7:1 (AA)
- Sunshine on Bold outline — 12.7:1 (AA)
- Sunshine on Night ink — 12.7:1 (AA)
- Clean white on Dusk grey — 9.1:1 (AA)
- Dusk grey on Clean white — 9.1:1 (AA)
- Dusk grey on Pale sun — 8.2:1 (AA)
- Pale sun on Dusk grey — 8.2:1 (AA)
- Dusk grey on Sunshine — 6.3:1 (AA)
- Sunshine on Dusk grey — 6.3:1 (AA)
- Clean white on Hot magenta — 5.8:1 (AA)
- Hot magenta on Clean white — 5.8:1 (AA)
- Hot magenta on Pale sun — 5.2:1 (AA)
- Pale sun on Hot magenta — 5.2:1 (AA)
- Hot magenta on Sunshine — 4.0:1 (AA large)
- Sunshine on Hot magenta — 4.0:1 (AA large)
- Bold outline on Hot magenta — 3.2:1 (AA large)
- Hot magenta on Bold outline — 3.2:1 (AA large)
- Hot magenta on Night ink — 3.2:1 (AA large)
- Night ink on Hot magenta — 3.2:1 (AA large)

## Principles

- Clean white is about 60% of the page so the two loud colours have room
- Hot magenta for headlines, buttons and big shapes, up to 20% of the page
- Sunshine for stickers, tags and highlights, about 10%, always with night ink text on it
- Never set body text in magenta, and never set magenta and sunshine on each other as text
- Bold outline draws thick borders around cards and buttons for a graphic edge