- A-Z
- Accordion
- Acronym
- Action
- Alert
- Breadcrumbs
- Button
- Card
- Checkboxes
- Confirmation
- Cookie banner
- Copy
- Date input
- Details
- Env
- Error summary
- Filter
- Footer
- Forms
- Group
- Header
- Help
- Hero
- Hr
- Input
- Leave site
- Notification
- Pagination
- Panel
- Progress
- Radios
- Search input
- Select
- Signage
- Skip link
- Status
- Steps
- Summary list
- Table
- Tabs
- Textarea
- Time input
Your web browser is out of date
Your web browser (the software you use to access the internet) is out of date. You need to update it or use a different web browser to ensure you can complete this form.
Cookie banner
The cookie banner component displays advisory content on what cookies are and how to manage them when using a system.
We must display cookie banners on public-facing applications and systems to ensure we are compliant with the Information Commissioner’s Office (ICO) guidelines, from a legal and reputational perspective.
The regulations (reg 6) state we must tell people cookies are used, explain what cookies are, and get people’s consent to store cookies on their device.
Visual preview and HTML code
<div class="asp-cookie-banner" role="region" aria-label="cookie preferences">
<div class="container asp-cookie-banner__container">
<div class="asp-cookie-banner__content">
<p class="sr-only">Cookie Preferences</p>
<p class="asp-cookie-banner__text">We use essential cookies to make this website work and optional cookies to help us measure how it is used. <a class="asp-cookie-banner__link" href="#">View details about cookies</a>.</p>
</div>
<div class="asp-cookie-banner__actions">
<button class="asp-button asp-cookie-banner__accept cookie-preference-button-accepted" type="button">I m ok with cookies</button>
<a class="asp-button asp-cookie-banner__manage" href="#">Manage cookies</a>
</div>
</div>
</div>
When to use this component
A cookie banner must be used for on all public-facing applications.
In addition to the banner, there is also a cookie preference page which allows users to set or change their preferences.
When not to use this component
Cookie banners are not needed for systems used by internal users. For example, some internal websites are restricted to the force network, so do not need a cookie banner. This is because the regulations only cover public use of systems.
Examples of where we have used this component
This component is used on:
- ASP website
- OPCC website
- Formation (public view)
This list is not exhaustive.
Status of development
The below criteria all need to be met for a component to be considered as fully developed for use within the ASP Digital Design System.
| Development criteria | Status |
|---|---|
| WCAG 2.2 compliant | Not started |
| WCAG 2.1 compliant | Completed |
| HTML / Nunjucks version | Completed |
| Figma version | Not started |
| M365 versions | Not started |
| Documentation | In progress |
Make a change to the Design System
Suggest an edit to this system, or any of the components in it, by submitting a Design System change request.
Published 12 June 2024
Last updated 23 July 2026