Typography
Font Size Examples
Small font size (0.88em) is 14.21px. It’s used for things like captions and brief clarification text.
Normal or Default font size (1.00 em) is 16px. It is the best fit for general paragraph text and should be the most used variant.
Medium font size (1.25em) is 22.8px. It’s good for catching attention at the start of a page with a brief introduction to the page content.
Large font size (1.60em) is 25.63px. It’s best for brief text that needs to stand out from the surroundings.
Huge font size (2.03em) is 32.4px. It’s the largest available paragraph text font size, for very brief calls to action.
Headings
Most headings are separated by two increments of the type scale, starting one increment below default paragraph text size.
See the headings section of the Style Guide for information on using headings in your content.
Subheading Examples
Heading one
Not for editor use. 2.56em (41.05px) on small screens and 2.88em (46.13px) on large.
Heading two
Heading two (2.03em) is 32.4px.
Heading three
Heading three (1.60em) is 25.63px.
Heading four
Heading four (1.125em) is 18px.
Heading five
Heading five (1.00 em) is 16px.
Heading six
Heading six (0.88em) is 14.21px.
Font Styles
Our theme provides a handful of font style variations that you can use to add meaning and emphasis to paragraph text. These include things like bold, emphasized (italic), and deleted (strikethrough) styles. Do not apply underline styles to any text.
Anchor Tag (aka. Link)
This is an example of a link.
Strong Tag
This tag shows bold text.
Emphasize Tag
The emphasize tag should italicize text.
Abbreviation Tag [Requires HTML editor]
This tag can srsly be used to identify what abbreviations stand for.
Subscript Tag [Requires HTML editor]
Getting our science styling on with H2O, which should push the “2” down.
Superscript Tag [Requires HTML editor]
Still sticking with science and Albert Einstein’s E = MC2, which should lift the 2 up.
Delete Tag & Insert Tag [Requires HTML editor]
Inline Code Tag [WP 5.2+]
Allows for including html
elements in inline code display.
Variable Tag [Requires HTML editor]
This allows you to denote variables.
Keyboard Tag [Requires HTML editor]
This scarcely known tag emulates keyboard text, which is usually styled like the <code>
tag.
Source
Paragraph and heading blocks are WordPress-created and built in to WordPress.
Font size and style options are customized by the HRS theme.