Skip to main content
British Red Cross homepage

Components

Browse our library of UI components designed for consistency, accessibility, and ease of use across all British Red Cross digital products.

Simple illustration of radio buttons, make up of a white outlined circle next to a horizontal navy line. There are three stacked on top of each other. One radio button looks selected and is filled with a navy circle.

Component library

Accordions

Breadcrumbs

Buttons

Cards

Checkboxes

Date input

Footer

Header

Hero

Map embed

Quote

Radio buttons

Select input

Status banner

Text input

Text area

Video

  • Teal coloured box with 3 solid circles and 3 outlined circles.

    Foundations

    Explore the core elements that shape our design language, including colour, typography, spacing, accessibility, and tone of voice.

  • Red coloured box with a pattern diagram, this includes a header made of simple boxes and some radio buttons made of circles and lines.

    Patterns

    Discover common user journeys and interaction patterns that help people navigate, donate, volunteer, and get support.