i

Content

5 components · 7 systems

The words, pictures and symbols a page is made of. Each block below is one system’s whole set of these components, drawn by its own package. To compare one control across every system drawn, open it from the rail.

Design systems shown

3 of 7 shown. Government, infrastructure and platform by default; add any other house to compare.

Carbon

2 of 5 drawn
Heading Heading (with Section)
Icon Icons (@carbon/icons-react)
Paragraph
absentCarbon does not ship paragraph. Nothing is drawn in its place.
Image
absentCarbon does not ship image. Nothing is drawn in its place.
Keyboard key
absentCarbon does not ship keyboard key. Nothing is drawn in its place.

GOV.UK

2 of 5 drawn
Heading Headings (style: govuk-heading-*)
Icon
absentGOV.UK does not ship icon. Nothing is drawn in its place.
Paragraph Paragraphs (style: govuk-body)
Image
absentGOV.UK does not ship image. Nothing is drawn in its place.
Keyboard key
absentGOV.UK does not ship keyboard key. Nothing is drawn in its place.

Material Web

1 of 5 drawn
Heading
absentMaterial Web does not ship heading. Nothing is drawn in its place.
Icon Icon (<md-icon>)
Paragraph
absentMaterial Web does not ship paragraph. Nothing is drawn in its place.
Image
absentMaterial Web does not ship image. Nothing is drawn in its place.
Keyboard key
absentMaterial Web does not ship keyboard key. Nothing is drawn in its place.