/
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 |
---|---|---|---|---|
1 | Image | Image | JPG, PNG | Optional |
2 | Tag |
| Text | Optional |
3 | Overline | Text | Optional | |
4 | Heading | Text | MANDATORY | |
5 | Description | 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