#ClimateEmergency

Typography examples

This page shows examples of George’s Typography components.

Start with Heading

The grey background starts with a heading level 2 that requires .g-first.

Loading demo…

Card after Paragraph

A card follows a paragraph; which also shows how to start with a paragraph instead of a heading.

Loading demo…

Card after Heading

A card follows a heading.

Loading demo…

Card with different Heading sizes

Displaying a visual heading hierarchy is possible by setting restrictHeadingSize: false.

Loading demo…

Comprehensive example

A complex example showing various nested cards and their respective headline levels.

Loading demo…

Marking a section as legal text (.g-small) will result in a reduced font size.

Loading demo…