Important

This is a live demo. It is not a real government service.

Component catalogue

Preview GOV.UK Frontend 6.5.1 components. Markup is rendered by this service’s PHP component library. Each link opens that component’s page with fixtures and a live preview.

• Accordion

  Lets users show and hide sections of related content.

• Back link

  Link to the previous page in a journey.

• Breadcrumbs

  Helps users move between levels of a section.

• Button

  Starts or continues an action.

• Character count

  Shows how many characters are left in a textarea.

• Checkboxes

  Lets users select one or more options.

• Cookie banner

  Asks users to accept or reject analytics cookies.

• Date input

  Asks users for a date they already know.

• Details

  Hides content that only some users need.

• Error message

  Tells users how to fix a field that failed validation.

• Error summary

  Summarises form errors at the top of the page.

• Exit this page

  Lets users leave a page quickly. For services where someone may be in danger.

• Feedback

  Asks users what they think of a page. Trial component in Frontend 6.5.

• Fieldset

  Groups related form fields, such as an address.

• File upload

  Lets users select a file to upload.

• Footer

  Page footer with Open Government Licence and Crown copyright.

• Generic header

  Header for services that are not branded as GOV.UK. Shown in the catalogue only.

• Header

  The GOV.UK masthead.

• Hint

  Extra help for a form field. Form controls include it; the catalogue shows it on its own.

• Text input

  Lets users enter a single line of text.

• Inset text

  Draws attention to important content on the page.

• Label

  Labels a form field. Form controls include it; the catalogue shows it on its own.

• Language navigation

  Lets users switch between languages. Trial component in Frontend 6.5.

• Notification banner

  Tells users about something that affects the whole service.

• Pagination

  Splits a long list across pages.

• Panel

  Confirms a transaction is complete.

• Password input

  Lets users enter a password, with a control to show or hide it.

• Phase banner

  Shows users that the service is still being tried out.

• Radios

  Lets users select one option from a list.

• Select

  Lets users choose one option from a long list.

• Service navigation

  Shows the service name under the GOV.UK masthead.

• Skip link

  Lets keyboard users skip to the main content.

• Summary list

  Summarises answers so users can check them.

• Table

  Shows information in rows and columns.

• Tabs

  Lets users switch between related views. Content stays in the page without JavaScript.

• Tag

  Shows a short status, such as on a task list.

• Task list

  Shows the tasks in an application and whether they are done.

• Textarea

  Lets users enter more than one line of text.

• Warning text

  Tells users about something important before they continue.