/
Page card

*This site is a work-in-progress and some pages are more complete than others. If you have any questions or issues, please email nick.harris@reckitt.com. *

Page card


Cards group information into flexible containers to let users browse a collection of related items and actions. Page cards feature other pages of the website allowing users to navigate to related content.


Usage

Do’s

  • Use page cards to link consumers to additional information contained on site

Anatomy

 

 

Item

Component type

Content type

Notes

 

Item

Component type

Content type

Notes

1

Image

Image

JPG, PNG

Optional

2

Tag

 

Text

Optional

3

Overline

Heading block

Text

Optional

4

Heading

Heading block

Text

MANDATORY

5

Description

Heading block

Text

MANDATORY

6

Card surface

n/a

n/a

Visible for 'standard' variant.

Visual style

  • Page cards come in two variants; default, and subtle.

  • This component has two modes: default, and inverse to cater for light and dark backgrounds.

Editorial

  • tbd

Behaviour

  • n/a

Accessibility

  • tbd