# NHS: brand book and build spec

NHS Blue and white, one lozenge, one typeface (Frutiger) and plain English. The identity is a public trust mark governed by law and policy: restraint is the style.

From unfairly.ai/brand-guidelines/nhs, checked 2026-10-31. Unofficial study; not affiliated with NHS.

Every value is labelled with where it came from: **published** (the brand says it), **observed** (measured or seen on its live site, with the date), **our reading** (inferred from the evidence) or **our recipe** (how we apply the system). Files beside this one: tokens.css, tokens.json (DTCG 2025.10), kit.json.

**Thesis (our reading):** Recognition is the brand. The NHS doesn't try to be distinctive in each piece; it tries to be the same everywhere, so blue, white and a plain Frutiger sentence instantly say "this is the NHS, you can rely on it". Based on: 98% prompted recognition of the lozenge, 87% recall of blue and white; the guidelines forbid alternative logos and extra fonts.

## Purpose

Mission: Signpost people to NHS organisations and services and help them identify official NHS information. (published; https://www.england.nhs.uk/nhsidentity/why-its-important/)

Story: A single NHS Identity was introduced in England in 1999. Research shows people see the NHS as one national, unified service and want its identity applied consistently; that consistency reassures them about the quality of care. (published)

| Value | What it means in the work | Source |
|---|---|---|
| Working together for patients | NHS value from the NHS Constitution | published: https://www.england.nhs.uk/nhsidentity/why-its-important/ |
| Respect and dignity | NHS value from the NHS Constitution | published: https://www.england.nhs.uk/nhsidentity/why-its-important/ |
| Commitment to quality of care | NHS value from the NHS Constitution | published: https://www.england.nhs.uk/nhsidentity/why-its-important/ |
| Compassion | NHS value from the NHS Constitution | published: https://www.england.nhs.uk/nhsidentity/why-its-important/ |
| Improving lives | NHS value from the NHS Constitution | published: https://www.england.nhs.uk/nhsidentity/why-its-important/ |
| Everyone counts | NHS value from the NHS Constitution | published: https://www.england.nhs.uk/nhsidentity/why-its-important/ |

## Fixed and flexible

Never changes:
- NHS Blue #005EB8 and white dominant
- The lozenge, original artwork, one per page
- Frutiger (Arial fallback), no other faces
- Sentence case, plain English

The one thing that varies: Supporting colour tiers, photography and graphic devices let an NHS organisation differ from other NHS organisations, never from the NHS.

## Positioning

- **Statement**: The national health service for England, recognised instantly by its blue and white identity and trusted as an official source of care and information. (our reading)
- **Category**: Public national health service (England) (published)
- **Audience**: Patients and the public in England, plus NHS staff and organisations who apply the identity (published)
- **Problem**: People need to know quickly whether a service or piece of information is genuinely from the NHS. (published)
- **Promise**: If it carries the NHS Identity, you can rely on it. (our reading)
- **Differentiators**: One identity across every NHS organisation; no alternative logos permitted.; A legally protected name and logo (UK trade marks, copyright).; Plain, clinically checked content written for a reading age of 9 to 11.; Accessibility built into the palette: every colour offers at least AA.
- **Alternatives**: Private healthcare providers and non-NHS health information sources (the identity exists to distinguish the NHS from them).

## Messaging

Boilerplate (published): The NHS Identity is the visual signpost to NHS organisations and services in England, introduced in 1999 so people can recognise information that comes from an official NHS source. It is managed by NHS England on behalf of the Department of Health and Social Care.

Taglines:
- NHS website for England (Homepage hero caption above the H1)
- Find information and services to help you manage your health (Homepage H1)

| Pillar | Claim | Proof | Label |
|---|---|---|---|
| Recognition | One national, unified identity people recognise instantly and trust as the NHS. | 98% prompted awareness of the NHS lozenge (public research, 2015).; 87% spontaneous awareness of the blue and white colours of the logo (public research, 2015). | published |
| Consistency | Applied the same way everywhere, so people know they can rely on the quality of care wherever they access it. | 98% prompted awareness of the NHS lozenge (public research, 2015). | published |
| Plain help | Clear, factual, accessible information that helps people manage their health. | Content aims at a reading age of 9 to 11; clinicians check clinical information. | published |
| Everyone counts | Accessible to all: imagery and words reflect the diversity of patients, the public and staff. | Six NHS values from the NHS Constitution sit behind the identity. | published |

They never claim:
- Suppliers may state they supplied the NHS only in plain descriptive text; never "approved", "endorsed", "certified" or "authorised".
- The NHS does not endorse third-party goods or services.
- Only original artwork for the NHS logo; never recreate it.

## Voice

Tone words: Clear, Reassuring, Personal, Factual, Empowering.

Traits:
- Authoritative, but not Formal (published)
- Empowering, but not Patronising (published)
- Personal, but not Chatty (published)
- Clear, but not Simplistic (published)

- Neutral and factual; authoritative but calm and reassuring (service manual voice).
- Empowering rather than patronising, personal rather than formal; address the reader as "you".
- Written communications should be clear, concise, straightforward, honest, open, professional, respectful and accessible (identity guide, aligned with the NHS Constitution).
- Write so it could be read aloud to one person.
- Tone shifts with the reader's state: direct, serious and reassuring for a diagnosis; encouraging and conversational for exercise or diet.
- Plain English first, medical term second, e.g. piles (haemorrhoids). Reading age 9 to 11 where possible.

Rules a copy check enforces:
- Sentence case headlines
- British spelling
- Write as "we", to "you"
- Sentences of 20 words or fewer
- No exclamation marks
- Never: should. Say say what to do, e.g. "talk to your doctor about" instead
- Never: don't, can't, won't, shouldn't. Say do not, cannot instead
- Say "have / get", not "experience"
- Short paragraphs of up to 3 sentences; use subheadings and bulleted lists
- Active voice: "find a pharmacy", not "a pharmacy can be found"
- Factual, neutral, unambiguous; no metaphors; say what you mean
- Use "good", "bad" or "easy" with care; give the evidence or the number instead
- Plain English term first, then the medical term in brackets
- Use positive contractions (you'll, we'll, you're); avoid should've, could've, would've
- No block capitals; sentence case everywhere including page titles
- No full stops in headings, buttons, action links or single-sentence link cards
- Straight, not curly, apostrophes
- Avoid dashes; if needed, an en dash (–). Avoid hyphens unless the meaning needs one
- Conditions and generic drug names lower case unless a proper name (type 1 diabetes, Parkinson's disease)
- Use precise numbers in context ("4 out of 5 people recover fully in a week") rather than vague reassurance
- Aim for a reading age of 9 to 11; where clinical content makes that hard, 11 to 14
- Avoid jargon, acronyms and unnecessary technical language
- Empower: "talk to your doctor about…" rather than "your doctor will tell you about…"
- On difficult subjects, show genuine understanding and respect; leave the reader informed and empowered

Their words: you, get, have, find.
Never: should (patronising), don't / can't (use do not, cannot), block capitals, metaphors, "a good chance of recovery" (vague), "approved", "endorsed", "certified" by the NHS (suppliers).

## Color

| Name | Hex | Role | Use |
|---|---|---|---|
| NHS Blue | #005EB8 | accent | Dominant brand colour; header, hero panel, links; the only ground the logo reverses out of |
| White | #FFFFFF | surface | Dominant with blue; cards and alternating bands |
| Grey 5 | #F0F4F5 | paper | Page ground online |
| Black (digital) | #212B32 | ink | All text online |
| Grey 1 | #4C6272 | ink_muted | Secondary text |
| Green (digital) | #007F3B | accent_secondary | Buttons, action-link arrows |
| NHS Dark Blue | #003087 | accent_dark | Link hover |
| Yellow (focus) | #FFEB3B | highlight | Focus state, warnings |
| Grey 4 | #D8DDE0 | border | Borders, card underlines |

## Typography

| Role | Their face | Licence | Open stand-in (Google Fonts) | Fallback |
|---|---|---|---|---|
| display | Frutiger 65 Bold | Proprietary (Monotype). NHS England sub-licenses three weights to NHS organisations in England only | Istok Web | "Istok Web", Arial, sans-serif |
| body | Frutiger 55 Roman | Proprietary (Monotype); NHS England sub-licence | Istok Web | "Istok Web", Arial, sans-serif |
| mono | None | n/a | JetBrains Mono | menlo, "Cascadia Mono", "Segoe UI Mono", consolas, "Liberation Mono", monospace |

| Role | Token | Face | Desktop | Phone | Line height | Tracking | Weight |
|---|---|---|---|---|---|---|---|
| Hero caption | --text-hero-caption-* | Istok Web | 32px | 24px | 1.125 | 0px | 700 |
| Hero headline | --text-display-hero-* | Istok Web | 43.2px | 32px | 1.125 | 0px | 700 |
| Section H2 | --text-heading-l-* | Istok Web | 36px | 27px | 1.167 | 0px | 700 |
| Card heading (link) | --text-heading-m-* | Istok Web | 26px | 22px | 1.231 | 0px | 700 |
| Action link | --text-action-link-* | Istok Web | 22px | 19px | 1.636 | 0px | 700 |
| Body | --text-body-* | Istok Web | 19px | 16px | 1.474 | 0.29px | 400 |
| Nav / footer / small | --text-body-s-* | Istok Web | 16px | 16px | 1.5 | 0.24px | 400 |

## Layout

Measured on https://www.england.nhs.uk/nhsidentity/identity-guidelines/: Identity law from the NHS Identity Guidelines; digital application from the NHS digital service manual and NHS.UK frontend; page anatomy measured on www.nhs.uk (Wayback snapshot 2026-10-26)..

| Measure | Desktop (1440) | Phone (390) |
|---|---|---|
| Page margin | 240px | 16px |
| Section padding | 64px | 48px |
| Container max width | 960px | full |
| Grid columns | halves (464 + 32 + 464) and thirds (299 + 32 + 299 + 32 + 299) |  |
| Gutter | 32px | 16px |
| Card gap | 32px | 32px |
| Navigation height | 128px | 128px |

Breakpoints from NHS's CSS: 320, 641, 769, 990px.

Homepage bands, top to bottom (observed):
1. Header
   - Desktop: 1440x128, y 0
   - Phone: 390x189
   - two rows 72 + 56
   - 1px #337EC6 line between rows inside the 960 container
2. Hero
   - Desktop: 1440x369, y 128-497
   - Phone: 390x347
   - panel 712x205 at x 240, y 170
   - cards overlap the bottom 90px
3. Hero cards
   - Desktop: y 407-664
   - Phone: y 446-872
   - 464x206 each, 32px gap
4. Manage your health
   - Desktop: y 664-1014
   - Phone: y 872-1201
   - rows every 58px
5. NHS services
   - Desktop: y 1014-1530
   - Phone: y 1201-1950
   - half columns 464 + 464
6. Featured
   - Desktop: y 1530-2093
   - Phone: y 1950-2744
   - 3 x 299px, equal height 354
7. More information and advice
   - Desktop: y 2093-2771
   - Phone: y 2744-3723
   - row 2 has 2 cards
8. Footer
   - Desktop: y 2771-3096
   - Phone: y 3723-4424
   - 4px #005EB8 top border

## Page anatomy

How NHS's own landing pages are built, part by part (observed; https://www.nhs.uk/ (Wayback snapshot 20261026012022, measured 2026-10-31), 2026-10-31). A homepage pattern, not a brand law: follow it for landing pages.

**Navigation**
- cookie banner: The reference was captured with the cookie banner dismissed and hidden. Do NOT build a cookie banner or confirmation bar.
- page frame: Container 960px centred (x 240-1200 at 1440), phone 16px gutters (x 16-374). Body ground #F0F4F5; sections alternate #F0F4F5 and #FFFFFF full bleed. Page height 3096px at 1440, 4424px at 390. All text Istok Web (Frutiger stand-in) #212B32 unless stated.
- voice on page: The homepage voice is the service-manual content voice: plain, task-first, sentence case, no slogans. Headings are the names of tasks and services; descriptions are one plain sentence. The identity guide's tone rules (clear, concise, honest, personal) are the same voice. Landing pages follow this homepage voice.
- summary: Solid NHS Blue #005EB8 header, 128px tall at desktop in two rows: top row (72px) logo left, search + My account right; second row (56px) five white underlined links. No sticky.
- ground: #005EB8 full bleed; a 1px #337EC6 line (box-shadow 0 -1px 0 0 #337EC6) on top of the nav row, spanning the 960px container only (x 240-1200)
- height: 128px desktop (72 + 56); 189px phone (130 + 59)
- border: none at bottom
- logo: variant white lozenge: white rectangle with the letters NHS cut out, so the blue header shows through the letters (asset nav-nhs-logo-white.svg); px 100x40 at x 240, y 16 desktop; 100x40 at x 16, y 16 phone; position top left (digital exception to the top-right print rule); size note nhs.uk draws the logo 100x40 at both widths with 16px margins (observed), not the identity guide's 30px mobile size; follow the observed size on this page.
- search: desktop x 794-1073, y 16, 279x40: input 235x40 white #FFFFFF, 1px solid #FFFFFF border, radius 4px 0 0 4px, padding 0 12px, placeholder "Search" 16px #4C6272-ish grey; submit button 44x40 fill #EDF4FA, radius 0 4px 4px 0, blue magnifier icon 28x28 #005EB8 centred; phone second line of the top row: x 16-374, y 74, 358x40 (input 314 + button 44); placeholder "Search" 16px #4C6272
- actions: "My account" button: x 1088, y 15, 113x42 (phone x 262, y 16, 112x42), fill #004B93, 1px solid #004B93 border, radius 4px, padding 8px 12px, text 16px/24px 400 white, underlined
- links: count 5; labels Health A to Z,NHS services,Healthy living,Mental health,Care and support; size 16px/24px 400; color #FFFFFF; decoration underline always (1px, auto offset); alignment left, first link text starts x 240; items padded 0 16px with link padding 16px 2px; row y 72-128; link x positions 240, 376, 503, 642, 784; positions rule Keep the measured x positions (240, 376, 503, 642, 784) over the padding when the stand-in changes the word widths.
- sticky: false
- phone: what shows Row 1: logo left + My account right (y 16). Row 2: full-width search (y 74). Row 3 (y 130-189, 59px): "Health A to Z", "NHS services", then "More" with a white down-chevron (button). The other three links go into the More dropdown.; menu More opens a white dropdown list of the five links (not shown at rest); cta none; positions Third row: link text "Health A to Z" x 16-120, "NHS services" x 136-232, "More" button x 247-308 (text from x 249, 16px white chevron-down after the word, 8px gap); items are padded 0 8px (not 16px as on desktop); link padding 16px 2px; row 59px tall; all three underlined.; divider No divider line on phone: the 1px #337EC6 rule is desktop only (between the logo row and the nav row). Phone header is uninterrupted blue from y 0 to 189.; more menu At rest the dropdown is closed and invisible. Chevron: white, 16px, pointing down.
- optical: Istok Web sits about 2px higher in a line box than Frutiger: nudge text blocks down 2px (padding-top +2px) in nav links, card headings and the hero panel to match Frutiger's ink position.

**Hero**
- summary: Full-bleed photo band (369px) with an NHS Blue text panel at the left of the container; two white cards overlap the bottom of the photo by 90px.
- desktop: band y 128-497, 1440x369, ground #005EB8 under a cover photo (hero-photo.png, background-size cover, background-position 100% 50%, no-repeat); padding 10px 0 90px; panel NHS Blue #005EB8 box x 240-952 (712px wide), y 170-375 (205px tall), padding 32px 24px, square corners, no border; sits 32px below the band top + 10px; text Line 1 caption "NHS website for England" 32px/36px 600 (Frutiger; set Istok Web 700) (Frutiger; set Istok Web 700) #D2E2F1 (1 line, y 202); line 2 headline "Find information and services to help you manage your health" 43.2px/48.6px 600 (Frutiger; set Istok Web 700) (Frutiger; set Istok Web 700) #FFFFFF in 2 lines (y 238-335, break after "to"). Both are spans inside one h1; text width 664px. 8px margin below the h1. With Istok Web the 664px line still breaks after "to" (2 lines); if a stand-in breaks differently keep 2 lines at 664px by keeping the same words per line.; cta none in the hero; media photo only; no overlay tint; photo behind cards UNMISSABLE: the photo band runs y 128-497. The two hero cards start at y 407, so for 90px the photo shows on both sides of and between the cards. Do NOT paint the grey #F0F4F5 ground behind the top 90px of the cards: grey starts at y 497 (desktop) and y 536 (phone). Build it as: hero section padding-bottom 90px; the cards container margin-top -90px with position:relative; the cards section must not have a background on its top 90px (use a ::before grey layer starting at 90px, or put the ground on a wrapper below).
- phone: band y 189-536, 390x347, background-position 70% 50%; panel x 16-374 (358 wide), y 231-414 (183 tall), padding 16px; text caption 24px/28.5px 600 (Frutiger; set Istok Web 700) (Frutiger; set Istok Web 700) #D2E2F1 (1 line); headline 32px/38px 600 (Frutiger; set Istok Web 700) (Frutiger; set Istok Web 700) white in 3 lines; order photo band, panel inside it, then the cards overlap below
- at rest: static; nothing animates
- media: hero-photo.png (1000x439, clinician holding a tablet, right side); the panel covers the left of the photo
- type: see spec.type display-hero-caption and display-hero
- proof: none

**Hero cards: Health A to Z and NHS services**
- summary: Two big white link cards side by side, pulled up 90px over the hero photo; grey-5 ground below.
- ground: #F0F4F5 (section), cards #FFFFFF
- desktop: section y 407-664; container margin-top -90px so cards start at y 407 (90px above hero bottom 497). Two cards 464x206 at x 240 and x 736 (32px gap), y 407. Section bottom = card bottom + 51px.
- phone: cards stacked, 358x191 each at y 446 and y 653 (16px gap), section ends y 872
- anatomy:
  - Card: white #FFFFFF, 1px solid #D8DDE0 border, square corners, box-shadow 0 3px 0 0 #D8DDE0 (a 3px grey underline)
  - Content padding 32px 80px 32px 32px desktop (24px 72px 24px 24px phone)
  - Heading: blue #005EB8 underlined link, 26px/32px 600 (Frutiger; set Istok Web 700) (Frutiger; set Istok Web 700) (phone 22px/29px), margin-bottom 24px (16 phone); headings are "Health A to Z" and "NHS services"
  - Description: 19px/28px 400 #212B32, 3 lines at desktop (350px wide), one sentence, no full stop: what the hub covers (conditions, symptoms, medicines, tests, treatments / GPs, pharmacies, prescriptions, hospitals, dentists)
  - Icon: blue chevron-in-circle 32x32 #005EB8 (icon-chevron-right-circle-blue.svg), absolutely placed right: x = card right - 65 (desktop x 639 / 1135), vertically centred on the card (y 494)
  - Whole card clickable
- components:
  - card_primary
- copy:
  - Health A to Z: "Find out about conditions, symptoms, medicines, tests and treatments, including when to get help" (3 lines desktop at 350px, 4 lines phone)
  - NHS services: "Find out about NHS services including GPs, pharmacies, prescriptions, hospitals and dentists" (3 lines desktop, 4 phone)
- spacing: Desktop: cards 464x206, card margin-bottom 51px, so the section ends y 664. Phone: cards 358x191, 16px apart, section ends 28px below the second card (y 872).

**Manage your health**
- summary: H2 plus four green action links in a single column.
- ground: #F0F4F5
- desktop: section y 664-1014 (350px), padding-bottom 28px; H2 at y 664 (no top padding: it follows the card section's 51px bottom space), list starts y 730, rows every 58px (y 730, 788, 846, 904); column 704px wide (two-thirds)
- phone: y 872-1201. H2 y 872 (27px/33px, margin 16px); rows at y 929, 976, 1023, 1094 (two-line labels 56px); icon 24x24 at x 14 (2px outside the gutter), text from x 42 (28px right of the icon left edge); text 19px/24px 700 blue.
- anatomy:
  - H2 "Manage your health" 36px/42px 600 (Frutiger; set Istok Web 700) (Frutiger; set Istok Web 700) #212B32, margin-bottom 24px
  - 4 action links, each li padding 8px 0 6px: green arrow-in-circle icon 36x36 #007F3B (icon-arrow-right-circle-green.svg) at left (x 236), text 22px/36px 600 (Frutiger; set Istok Web 700) (Frutiger; set Istok Web 700) #005EB8 NOT underlined, starting x 280
  - Labels (wayfinding, verbatim): "Order a repeat prescription", "View your test results", "Find out how to book an appointment at your GP surgery", "Find out how to register with a GP surgery"
- components:
  - action_link
- spacing: Desktop: H2 y 664, margin-bottom 24px; list y 730; each li is 58px (padding 8px 0 6px around a 44px link); list margin-bottom 24px; section padding-bottom 28px. Icon left edge x 236 (4px left of the container edge), text from x 280. Phone: H2 y 872 (27px/33px, margin 16px); rows at y 929, 976, 1023, 1094 (two-line labels 56px); icon 24x24 at x 14 (2px outside the gutter), text from x 42 (28px right of the icon left edge); text 19px/24px 700 blue.

**NHS services**
- summary: White band: H2, then two half columns: a stack of four solid blue link bars plus one action link on the left; a grey "Help from NHS 111" card on the right.
- ground: #FFFFFF
- desktop: section y 1014-1530, padding 64px 0 28px; H2 y 1078; columns start y 1144: left x 240-704 (464), right x 736-1200 (464)
- phone: y 1201-1950. section padding 48px 0 28px; H2 27px/33px with 16px margin-bottom; bars start y 1308 (26px under the H2), 48px tall (72 for 2 lines), 4px apart; action link at y 1554; the grey 111 card follows at y 1611 (25px below the action link), full width 358, padding 24px (NOT 32), heading 22px/29px with 16px margin-bottom, paragraphs 16px/24px with 16px between them; card bottom + 40px margin.
- anatomy:
  - H2 "NHS services" 36px/42px 600 (Frutiger; set Istok Web 700) (Frutiger; set Istok Web 700), margin-bottom 24px
  - Blue link bars: 464x52 each (two-line one 80px), fill #005EB8, square corners, padding 12px 24px, text 19px/28px 400 white NOT underlined, white chevron 24x24 at right (x 668), 4px gap between bars (y 1154, 1210, 1266, 1322); phone 16px/24px, padding 12px 16px, 48px tall
  - Bar labels verbatim: "Find a pharmacy", "Find a dentist", "Find a GP", "Find NHS talking therapies for anxiety and depression" (wraps to 2 lines)
  - Below the bars (y 1428): action link "Find other NHS services" (green arrow 36px, 22px 600 (Frutiger; set Istok Web 700) blue text)
  - Right: card 464x310 at y 1144, fill #F0F4F5 (grey, not white), 1px solid #D8DDE0 border, no shadow, padding 32px; H3 "Help from NHS 111" 26px/32px 600 (Frutiger; set Istok Web 700) (Frutiger; set Istok Web 700) #212B32 (not a link) margin-bottom 24px; then 3 paragraphs 19px/28px with 24px gaps: a 3-line explanation that NHS 111 tells you what to do next if you are worried about a symptom; "Go to 111.nhs.uk or call 111." with the two underlined blue links; "For a life-threatening emergency call 999."
- components:
  - link_bar
  - action_link
  - card_panel_grey
- copy:
  - NHS 111 card paragraph 1 (3 lines desktop, 3 phone): if you are worried about a symptom and not sure what help you need, NHS 111 can tell you what to do next
  - Paragraph 2: "Go to 111.nhs.uk or call 111." — the link texts are "111.nhs.uk" and "call 111"
  - Paragraph 3: "For a life-threatening emergency call 999."
- spacing: Desktop: column top y 1144; the bar list has margin-top 10px (first bar y 1154); bars 4px apart; action link "Find other NHS services" 26px below the last bar (y 1428). Phone: section padding 48px 0 28px; H2 27px/33px with 16px margin-bottom; bars start y 1308 (26px under the H2), 48px tall (72 for 2 lines), 4px apart; action link at y 1554; the grey 111 card follows at y 1611 (25px below the action link), full width 358, padding 24px (NOT 32), heading 22px/29px with 16px margin-bottom, paragraphs 16px/24px with 16px between them; card bottom + 40px margin.

**Featured**
- summary: Grey band: H2 and three equal white link cards.
- ground: #F0F4F5
- desktop: section y 1530-2093, padding 64px 0 28px; H2 y 1594; cards row y 1660, three columns 299px wide at x 240, 571, 901 (32px gaps), all stretched to the same height 354px
- phone: y 1950-2744. padding 48px 0 28px; H2 + 16px; cards full width 358, padding 24px, 19px apart; heading 22px/29px 2-3 lines + 16px; description 16px/24px; list margin-bottom 40px.
- anatomy:
  - H2 "Featured" 36px/42px 600 (Frutiger; set Istok Web 700) (Frutiger; set Istok Web 700)
  - Card: #FFFFFF, 1px solid #D8DDE0, square, box-shadow 0 3px 0 0 #D8DDE0, padding 32px (24 phone); no icon
  - Card heading: blue underlined link 26px/32px 600 (Frutiger; set Istok Web 700) (Frutiger; set Istok Web 700), 3 lines at 233px text width, margin-bottom 24px
  - Description 19px/28px 400 #212B32, 2-6 lines
  - Card headings verbatim: "Find a walk-in COVID-19 vaccination site", "Find a pharmacy that offers free flu vaccination", "Refer yourself for help for back and joint problems"; descriptions are one plain sentence each about the service (no full stop)
- components:
  - card_primary
- copy:
  - Walk-in COVID-19 vaccination: one sentence of about 17 words on finding a vaccination site or pharmacy that offers COVID-19 vaccinations without an appointment (5 lines at 233px)
  - Free flu vaccination: one sentence of about 11 words on using the service to find a pharmacy offering flu vaccinations (3 lines)
  - Back and joint problems: one sentence of about 16 words on getting NHS help from community musculoskeletal (MSK) services such as physiotherapy (6 lines; this tallest card sets the row height 354)
- spacing: Desktop: padding 64px 0 28px; H2 42px + 24px margin; cards row y 1660, all 354px tall (stretch to the tallest); card margin-bottom 35px + list margin-bottom 16px = 51px under the cards; section ends y 2093. Phone: padding 48px 0 28px; H2 + 16px; cards full width 358, padding 24px, 19px apart; heading 22px/29px 2-3 lines + 16px; description 16px/24px; list margin-bottom 40px.

**More information and advice**
- summary: White band: H2 and a 3-column grid of borderless link cards, each with a grey underline.
- ground: #FFFFFF
- desktop: section y 2093-2771, padding 64px 0 28px; H2 y 2157 (960 wide); grid rows at y 2223 and 2483; columns 299px at x 240, 571, 901; row 1 has 3 cards, row 2 has 2 (third cell empty)
- phone: y 2744-3723. padding 48px 16px 28px; H2 27px/33px in 2 lines + 16px; cards full width, content padding 0 0 24px, heading 22px/29px + 16px, description 16px/24px, 19px between cards (card margin-bottom 19px; heights 142/142/118/…).
- anatomy:
  - H2 "More information and advice" 36px/42px 600 (Frutiger; set Istok Web 700) (Frutiger; set Istok Web 700) (phone 2 lines)
  - Card: transparent (white band shows), NO side/top border, only a 1px #D8DDE0 bottom border plus box-shadow 0 3px 0 0 #D8DDE0 (a 4px grey underline in total); content padding 0 0 32px; card height 201; 24px between rows (li margin-bottom 24px plus card margin 35px)
  - Heading blue underlined link 26px/32px 600 (Frutiger; set Istok Web 700) (Frutiger; set Istok Web 700), 1 line; description 19px/28px, 2-4 lines
  - Headings verbatim: "Vaccinations", "COVID-19", "Baby", "Women's health", "Contraception"
- components:
  - card_link_plain
- copy:
  - Vaccinations: 4 lines (about 19 words: vaccinations for babies, children and adults, why they matter, how to get them)
  - COVID-19: 4 lines (symptoms, treatments, avoiding catching and spreading it; this one ends with a full stop on nhs.uk)
  - Baby: 2 lines (a guide to caring for a baby)
  - Women's health: 3 lines (information and support on health, wellbeing, conditions and screening)
  - Contraception: 4 lines (types of contraception, where to get them, how well they work)
- spacing: Desktop: padding 64px 16px 28px; H2 + 24px; rows 59px apart (li margin-bottom 24px + card margin-bottom 35px): row 1 y 2223 (cards 201px tall incl. 32px bottom padding and the 4px underline), row 2 y 2483. Phone: padding 48px 16px 28px; H2 27px/33px in 2 lines + 16px; cards full width, content padding 0 0 24px, heading 22px/29px + 16px, description 16px/24px, 19px between cards (card margin-bottom 19px; heights 142/142/118/…).

**Footer**
- summary: Grey #D8DDE0 footer with a 4px NHS Blue top border, four columns of small underlined dark-blue links, then a hairline and the copyright line.
- ground: #D8DDE0; border-top 4px solid #005EB8
- anatomy:
  - Desktop: y 2771-3096 (325px), padding 32px 0; four lists 216px wide at x 240, 488, 736, 984 (32px gaps), starting y 2807
  - Links 16px/24px 400 #003087, underlined, 8px between items
  - Column 1: Home, Health A to Z, NHS services, Healthy living, Mental health, Care and support
  - Column 2: NHS App, View your test results, About the NHS, Healthcare abroad
  - Column 3: Manage NHS profiles, Other NHS websites
  - Column 4: About us, Report an issue with the NHS website (wraps 2 lines), Accessibility statement, Our policies, Cookies
  - No column headings (a visually hidden "Support links" heading only)
  - Meta row at y 3015: 1px solid #AEB7BD top border across 960px, padding-top 24px, "© Crown copyright" 16px/24px #212B32
  - No logo, no social icons, no address or phone in the footer
- phone: y 3723-4424; padding 24px 0; the four lists stacked one under another (24px gaps), then the hairline and © Crown copyright (padding-top 16px)

**On dark grounds**
- note: The only dark ground is NHS Blue #005EB8 (header, hero panel, link bars).
- secondary button: not used on the homepage
- link: #FFFFFF underlined
- muted text: #D2E2F1
- hairline: #337EC6
- logo variant: white lozenge with cut-out letters

## Components

- **card primary** (observed): fill #FFFFFF, border 1px solid #D8DDE0, radius 0, shadow 0 3px 0 0 #D8DDE0, padding 32px (32px 80px 32px 32px when it has the chevron icon); phone 24px, heading 26px/32px 700 (Frutiger 600) #005EB8 underlined link, body 19px/28px #212B32, icon 32px blue chevron-in-circle at right, vertically centred, hover heading link colour #003087 (NHS.UK frontend link hover)
- **card link plain** (observed): fill transparent, border bottom 1px solid #D8DDE0 only, shadow 0 3px 0 0 #D8DDE0, padding 0 0 32px
- **card panel grey** (observed): fill #F0F4F5, border 1px solid #D8DDE0, shadow none, padding 32px, phone padding 24px
- **action link** (observed): icon 36x36 green #007F3B circle with white arrow (cut-out), 24x24 on phone, text 22px/36px 700 (Frutiger 600) #005EB8, no underline (phone 19px/24px), gap text starts 44px right of the icon left edge, padding 8px 0 0 40px, phone icon 24x24 at x 14, text from x 42, 19px/24px, hover text underlined on hover (NHS.UK frontend); colour unchanged
- **link bar** (observed): fill #005EB8, text 19px/28px 400 #FFFFFF, no underline, padding 12px 24px (phone 12px 16px), height 52px one line, 80px two lines (phone 48/72), radius 0, gap 4px, icon white chevron 24x24 at the right, 12px from the edge, hover fill #003087 (published dark blue); text stays white
- **button primary** (published): fill #007F3B, text #FFFFFF, radius 4, shadow 0 4px 0 #00401E (50% shade), hover #00662F (20% shade), weight 700. not on the homepage; NHS.UK frontend default
- **search** (observed): input white, 1px white border, radius 4px 0 0 4px, 40px tall, button #EDF4FA fill, radius 0 4px 4px 0, 44x40, blue magnifier 28px
- **account button** (observed): fill #004B93, border 1px solid #004B93, radius 4, text 16px white underlined, size 113x42, hover fill #003087
- **focus** (published): style yellow #FFEB3B background with a 4px #212B32 bottom bar on focused links (NHS.UK frontend focus state)
- **states note** (published): text Hover colours come from NHS.UK frontend (link hover = dark-blue #003087); they were not observed on the live page. Focus: yellow #FFEB3B fill with a 4px #212B32 bottom bar on every focused link and button.

States (hover, focus, pressed, disabled) weren't measured; define them before you build.

## Icon tokens

Grid 24px viewBox, stroke solid filled shapes, no strokes (published).
| Name | Size | Use |
|---|---|---|
| small | 20px |  |
| default | 24px |  |
| large | 32px |  |

## Signature moves

### NHS Blue header

Where: top of every NHS web page.
Do: solid #005EB8 band, white lozenge logo top left at 40px high, white underlined nav links; no graphic devices or straplines at the top of the page.
Don't: put imagery or straplines in the header area.

### Grey page, white square cards

Where: content sections.
Do: #F0F4F5 page ground; white cards with 1px #D8DDE0 border and a 3px #D8DDE0 underline shadow, square corners.
Don't: round the cards or add drop shadows.

### Green action link

Where: links that start a task or service.
Do: green #007F3B circle with a cut-out arrow, then bold blue text.
Don't: use it for ordinary navigation.

## Messaging: rules

The identity is a signpost, not a campaign: its job is to show that something comes from the NHS. The homepage leads with what the reader can do (find information and services) rather than a slogan.

Why it works: People already trust the NHS; the message is reassurance through recognition and plain help.

- Lead with the task the reader came for
- State facts and numbers, not adjectives
- Never imply NHS endorsement of a third party
- Don't use straplines near the logo or in its position (top right/top left)
- Don't claim endorsement for suppliers

Sources: https://www.england.nhs.uk/nhsidentity/why-its-important/, https://www.england.nhs.uk/nhsidentity/identity-guidelines/visual-styles-graphic-devices-and-straplines/, https://www.england.nhs.uk/nhsidentity/identity-guidelines/who-cannot-use-the-nhs-identity/, https://www.nhs.uk/

## Voice: rules

Two published sources agree: the identity guide asks for clear, concise, honest, respectful, accessible writing that could be read aloud to one person; the service manual sets a neutral, factual, calm and reassuring voice that is personal and empowering. Tone flexes by the reader's situation.

Why it works: Health information is read by worried people; calm, plain, precise words lower anxiety and raise understanding.

|  |  |
|---|---|
| Voice | neutral, factual, calm, reassuring, personal |
| Reading age | 9 to 11 (11 to 14 for hard clinical content) |
| Sentence | up to 20 words |
| Paragraph | up to 3 sentences |
| Case | sentence case |
| Apostrophes | straight |

- Address the reader as "you"
- Sentences up to 20 words, paragraphs up to 3 sentences
- Plain English first, then the medical term
- Use "do not", never "don't"
- Sentence case everywhere; no block capitals
- No full stops in headings, buttons or link cards
- Don't use "should"
- Don't use metaphors or vague reassurance
- Don't use jargon or acronyms without explanation

Real examples, to look at on NHS's own pages (not for reuse):
- The NHS content guide index (reference screenshot of a guideline page; not for the build): https://service-manual.nhs.uk/content

Sources: https://www.england.nhs.uk/nhsidentity/identity-guidelines/tone-of-voice/, https://service-manual.nhs.uk/content/voice-and-tone, https://service-manual.nhs.uk/content/how-we-write, https://service-manual.nhs.uk/content/punctuation, https://service-manual.nhs.uk/content/numbers-measurements-dates-time

## Logo: rules

The NHS logo (the lozenge) is the white letters NHS in a solid NHS Blue rectangle. It is the only logo the NHS in England uses; alternative logos for teams, buildings or programmes are not permitted. Use of the identity is restricted: NHS organisations must use it; third-party providers only on the NHS services they deliver; suppliers and endorsements may not use it at all.

Why it works: 98% of the public recognise it; consistency is what makes it a trust mark.

|  |  |
|---|---|
| Clear space print | 1 × logo height |
| Clear space digital | 0.5 × logo height |
| Desktop | 40px high, 30px margin |
| Tablet | 35px high, 20px margin |
| Mobile | 30px high, 15px margin |
| Minimum digital | 30px high |
| A4 print | 10mm logo and margin |

- Original artwork only; never recreate the logo
- Clear space: full logo height in print, half the logo height in digital
- Digital size: desktop (>1000px) 40px high with 30px margin; tablet 35px/20px; mobile (<600px) 30px/15px; minimum 30px high (favicons excepted)
- Top right in print; position flexible in digital (nhs.uk puts it top left in the header)
- Preferred ground white; also NHS Blue (reversed white), 15% tint of NHS Blue, pale grey, uncluttered pale or blue photos
- Reverse only out of 100% NHS Blue, never a tint or another colour
- One-colour print: NHS Blue or black only
- Only one NHS logo per page
- Don't place it on support or highlight colours, black or dark grey
- Don't put an outline around it
- Don't embed it in a line of text in place of the letters NHS
- Don't use it if you are a supplier, or on a personal social account
- Don't use any red cross or plus symbol (Geneva emblem)

Real examples, to look at on NHS's own pages (not for reuse):
- NHS Identity Guidelines index (reference screenshot of a guideline page; not for the build): https://www.england.nhs.uk/nhsidentity/identity-guidelines/

Sources: https://www.england.nhs.uk/nhsidentity/identity-guidelines/nhs-logo/, https://www.england.nhs.uk/nhsidentity/identity-guidelines/who-can-use-the-nhs-identity/, https://www.england.nhs.uk/nhsidentity/identity-guidelines/who-cannot-use-the-nhs-identity/, https://www.england.nhs.uk/nhsidentity/identity-guidelines/visual-styles-graphic-devices-and-straplines/

## Color: rules

NHS Blue #005EB8 and white dominate; four supporting levels follow in decreasing emphasis: Level 1 blues, Level 2 neutrals, Level 3 support greens, Level 4 highlights (minimal, never large blocks). Online, NHS.UK frontend maps this to a digital palette: text #212B32, secondary text #4C6272, grey-5 #F0F4F5 page ground with white cards and alternating white bands, links NHS Blue, buttons green #007F3B, focus yellow #FFEB3B.

Why it works: 87% of people spontaneously recall blue and white when asked about the NHS; the tiers let organisations differ from each other without differing from the NHS.

|  |  |
|---|---|
| NHS Blue | #005EB8 · Pantone 300 · RAL 5017 |
| Text online | #212B32 |
| Page ground online | #F0F4F5 |
| Button | #007F3B |
| Focus | #FFEB3B |
| Contrast | WCAG 2.2 AA minimum, AAA where possible |

- NHS Blue and white always dominant
- Supporting colours in decreasing emphasis: blues, neutrals, greens, highlights
- Highlights minimal; never large blocks
- Tints allowed if clear and accessible; type and logos always 100% solid
- Every palette colour offers at least AA; aim for AAA online
- Grey-5 page ground online to reduce glare; white for cards and alternating bands
- Yellow for focus and warnings; red for urgent care
- Euro Ambulance Yellow only for ambulance livery
- Don't use black or dark grey as backgrounds
- Don't reverse the logo out of anything but NHS Blue
- Don't let greens or highlights dominate
- Don't rely on colour alone to convey meaning

Not published: exact proportions of the emphasis chart (shown as a chart, no percentages); a hex for Euro Ambulance Yellow (RAL 1016 only).

Real examples, to look at on NHS's own pages (not for reuse):
- Service manual colour page (reference screenshot of a guideline page; not for the build): https://service-manual.nhs.uk/design-system/styles/colour

Sources: https://www.england.nhs.uk/nhsidentity/identity-guidelines/colours/, https://service-manual.nhs.uk/design-system/styles/colour, https://github.com/nhsuk/nhsuk-frontend/blob/main/packages/nhsuk-frontend/src/nhsuk/core/settings/_colours-palette.scss, https://github.com/nhsuk/nhsuk-frontend/blob/main/packages/nhsuk-frontend/src/nhsuk/core/settings/_colours-applied.scss

## Typography: rules

Frutiger since 1999: 65 Bold for titles, 55 Roman for body, 45 Light for very large titling. Arial is the secondary font when Frutiger is unavailable. No other fonts, even for children's materials (foreign-language fonts excepted). Online: Frutiger W01 at 400 and 600, with a published responsive scale (64/48/36/26/22/19/16/14 at tablet and up).

Why it works: Frutiger was designed for legibility at a distance and at small sizes; people now associate it with the NHS.

|  |  |
|---|---|
| Real face | Frutiger 45 Light, 55 Roman, 65 Bold |
| Web family | "Frutiger W01", Arial, sans-serif |
| Weights online | 400, 600 |
| Scale (tablet+) | 64/70, 48/54, 36/42, 26/32, 22/30, 19/28, 16/24, 14/24 |
| Scale (mobile) | 48/54, 32/38, 27/33, 22/29, 19/27, 16/24, 14/24, 12/20 |

- Frutiger only (Arial as fallback); no other faces
- Bold for titles, Roman for body
- Body 19px on large screens, 16px on small
- Lead paragraph 26px, once per page
- Avoid italics online (less accessible)
- Sentence case; never block capitals
- Don't use decorative or child-friendly fonts
- Don't use italics online
- Don't set type in a tint

Real examples, to look at on NHS's own pages (not for reuse):
- Service manual typography page (reference screenshot of a guideline page; not for the build): https://service-manual.nhs.uk/design-system/styles/typography

Sources: https://www.england.nhs.uk/nhsidentity/identity-guidelines/fonts/, https://service-manual.nhs.uk/design-system/styles/typography, https://github.com/nhsuk/nhsuk-frontend/blob/main/packages/nhsuk-frontend/src/nhsuk/core/settings/_typography.scss, https://github.com/nhsuk/nhsuk-frontend/blob/main/packages/nhsuk-frontend/src/nhsuk/core/settings/_globals.scss

## Graphic elements: rules

The identity deliberately has few graphic elements: the logo, NHS Blue fields and Frutiger do the work. Organisations may add graphic devices, straplines and imagery for a visual style, but not near the logo, and on websites the top of the page stays clear of them. Online, the signature elements are functional: the solid NHS Blue header, white square cards on a grey-5 ground, green circle-arrow action links, blue chevron-in-circle cards, the 4px yellow focus ring.

Why it works: Restraint keeps every NHS organisation recognisably part of one service.

- Keep graphic devices away from the logo and out of its positions
- Keep the top of websites clear of graphic devices and straplines
- Use NHS.UK components (cards, action links, care cards) rather than decoration
- Don't create alternative logos for teams, buildings or programmes
- Don't use red cross or plus icons

Sources: https://www.england.nhs.uk/nhsidentity/identity-guidelines/visual-styles-graphic-devices-and-straplines/, https://service-manual.nhs.uk/design-system/styles/icons, https://www.nhs.uk/

## Iconography: rules

A small functional set in NHS.UK frontend: left/right arrows, right arrow in a circle (action links that start a service), right chevron in a circle (primary cards), tick and cross, search, user, plus BSL icons.

Why it works: Icons signpost actions, never decorate.

|  |  |
|---|---|
| Sizes | 20 / 24 / 32px |
| Action link | green arrow in a circle |
| Primary card | blue chevron in a circle |

- Use icons sparingly, not for decoration
- Icon buttons at least 24 × 24px target
- Icon sizes 20, 24, 32px
- Give icon-only controls an accessible name
- Don't use a red cross or plus symbol

Sources: https://service-manual.nhs.uk/design-system/styles/icons, https://github.com/nhsuk/nhsuk-frontend/blob/main/packages/nhsuk-frontend/src/nhsuk/core/settings/_globals.scss, https://www.england.nhs.uk/nhsidentity/identity-guidelines/visual-styles-graphic-devices-and-straplines/

## Illustration: rules

No illustration style is published. The colour palette applies to illustrations (skin tones excepted).

Why it works: The identity governs colour, not drawing style.

- Use the NHS palette in illustrations; use whatever skin tones are needed
- Avoid clip art
- Don't use clip art

Sources: https://www.england.nhs.uk/nhsidentity/identity-guidelines/colours/, https://www.england.nhs.uk/nhsidentity/identity-guidelines/imagery/

## Photography: rules

Photography must reflect the diversity of patients, public and staff, show the NHS treating and preventing ill health, look professional, and feature real NHS patients and staff where possible, with consent. The palette does not apply to portrait photography; abstract images must follow it.

Why it works: Images express the NHS values: everyone counts, people at the heart of care.

- Represent diversity across all protected characteristics
- Real NHS patients and staff where possible, with recorded consent
- High quality; no clip art
- Abstract images follow the NHS palette
- Don't use poor-quality photos
- Don't use third-party images without permission

Sources: https://www.england.nhs.uk/nhsidentity/identity-guidelines/imagery/, https://www.england.nhs.uk/nhsidentity/identity-guidelines/colours/

## Motion: rules

Not published. Neither the identity guidelines nor the service manual define a motion system.

Why it works: —

Sources: https://www.england.nhs.uk/nhsidentity/, https://service-manual.nhs.uk/

## Interface and layout: rules

Mobile-first, single column up to wider layouts; 960px default max page width; lines of text 70 to 80 characters; breakpoints 320/641/769/990px; 32px gutter; 4px-based spacing scale 4–64px that tightens on small screens.

Why it works: Most visitors use a mobile device.

|  |  |
|---|---|
| Max width | 960px |
| Gutter | 32px |
| Breakpoints | 320 / 641 / 769 / 990px |
| Radius | 4px buttons |
| Border | 4px |
| Focus | 4px yellow |

- Design mobile first
- Max page width 960px
- Grid columns: full, three-quarters, two-thirds, one-half, one-third, one-quarter
- Responsive spacing scale (0–9): 0, 4, 8, 16, 24, 32, 40, 48, 56, 64px large; 0, 4, 8, 8, 16, 24, 32, 40, 48, 56px small
- Don't let lines of text exceed 70 to 80 characters

Sources: https://service-manual.nhs.uk/design-system/styles/layout, https://service-manual.nhs.uk/design-system/styles/spacing, https://github.com/nhsuk/nhsuk-frontend/blob/main/packages/nhsuk-frontend/src/nhsuk/core/settings/_globals.scss, https://github.com/nhsuk/nhsuk-frontend/blob/main/packages/nhsuk-frontend/src/nhsuk/core/settings/_breakpoints.scss

## Rules: rules

The identity is policy, not suggestion: NHS organisations must apply it, and use by others is restricted by law.

Why it works: Patients expect a single NHS; deviations read as private or partner services.

- NHS Blue and white dominant
- One NHS logo per page, original artwork
- Frutiger or Arial only
- Plain English, sentence case, reading age 9 to 11
- No alternative logos
- Every colour pairing accessible (AA minimum)
- Don't use the NHS identity unless you are an NHS organisation or permitted provider
- Don't imply NHS endorsement
- Don't use red cross or plus symbols

Sources: https://www.england.nhs.uk/nhsidentity/why-its-important/identity-policy-and-principles/, https://www.england.nhs.uk/nhsidentity/identity-guidelines/who-can-use-the-nhs-identity/, https://www.england.nhs.uk/nhsidentity/identity-guidelines/who-cannot-use-the-nhs-identity/, https://www.england.nhs.uk/nhsidentity/identity-guidelines/colours/, https://www.england.nhs.uk/nhsidentity/identity-guidelines/fonts/, https://www.england.nhs.uk/nhsidentity/identity-guidelines/nhs-logo/

## Applications

| Format | What | Source |
|---|---|---|
| website | nhs.uk: NHS Blue header with the lozenge top left, grey-5 page, white square cards, green action links, Frutiger throughout. | https://www.nhs.uk/ |
| signage | Frutiger Bold titles, Roman supporting copy, organisational logo. | https://www.england.nhs.uk/nhsidentity/identity-guidelines/fonts/ |
| leaflets and reports | Bold titles, Roman body, Light lead-ins; logo top right. | https://www.england.nhs.uk/nhsidentity/identity-guidelines/fonts/ |
| social media | Cover photo with the visual style or plain NHS Blue, no text; digital exclusion zone around the logo. | https://www.england.nhs.uk/nhsidentity/identity-guidelines/visual-styles-graphic-devices-and-straplines/ |

## By format

How our engine applies the NHS system to each format. Our recipe from their rules, not something the NHS publishes. Level = how much colour beyond blue and white. Loudness runs 0 (nothing but the essentials) to 5 (the signature moves at full volume).

| Format | Loudness 0–5 | Must appear | What varies |
|---|---|---|---|
| Landing page | 1 | Build it the way nhs.uk is built (kit.spec.page): solid NHS Blue header, grey-5 #F0F4F5 page, white square cards, Frutiger (stand-in) 600 headings in sentence case, #212B32 text, NHS Blue underlined links, green circle-arrow action links; logo top left in the header at 40px high on desktop | which sections and how many cards |
| Slides | 1 | White or NHS Blue grounds, Bold titles, plain sentences | one support colour as an accent |
| Print / poster | 2 | Logo top right with its margin, NHS Blue dominant, Frutiger Bold titles | photography and one graphic device |
| Social | 2 | Digital exclusion zone around the logo; no text on cover images | visual style or plain NHS Blue |

## Checks before anything ships

- **Logo hidden**: Cover the logo. It should still read as NHS: blue and white dominant, Frutiger-like sans, plain sentence-case words.
- **Plain English**: Read it aloud to one person. Sentences under 20 words, no "should", no jargon.

## Make it your own

Keep the system: color roles and proportions, type, layout, components, the signature moves, the voice traits and rules. Replace everything that is NHS's own: name and logo, positioning, pillars, proof, taglines, boilerplate and any real line quoted above. kit.json lists these under make_it_yours.

## Not published

- Motion system: not published.
- Illustration style: not published (palette only).
- Exact colour-emphasis proportions: shown as a chart, no percentages published.
- Euro Ambulance Yellow: RAL 1016 only, no hex published.
- Frutiger files: licensed to NHS organisations in England only; not available, stand-in used.
- Identity black #231F20 (print) differs from the digital text black #212B32 (NHS.UK frontend); both kept, scoped.
- Identity greens (#009639, #006747) differ from the digital button green #007F3B; digital pages use the frontend value.
- www.nhs.uk and service-manual.nhs.uk refused connections from our capture machine on 2026-10-31; the homepage and service manual pages were read from Wayback Machine snapshots (2026-10-26) and the nhsuk-frontend / nhsuk-service-manual GitHub sources.

Logos and reference images belong to NHS. Look at them on NHS's own pages; don't reuse them.