{namespace sg = TYPO3\CMS\Styleguide\ViewHelpers} **************************************** Colors ****************************************

Typography

TYPO3 Backend Module Headline


TYPO3 Backend Module Headline


TYPO3 Backend Module Headline


TYPO3 Backend Module Headline

This is a very large headline.

Module headline "H1", once for each backend module.
With 2.1em (23px) and normal font weight.

This is a large headline.

Second headline "h2", for every section.
With 1.3em (14px) and normal font weight.

This is a medium headline.

Sub-headline "h3", for logical distinction inside sections.
With 1.1em (12px) and normal font weight.

This is a moderate headline.

Content headline "h4", for paragraphs.
With 1em (11px) and normal font weight.

**************************************** Copy text ****************************************

Copy text

This is a paragraph. Paragraphs are preset with a font size, line height and spacing to match the overall vertical rhythm. To show what a paragraph looks like this needs a little more content so, did you know that there are storms occurring on Jupiter that are larger than the Earth? Pretty cool. Wrap "strong" around type to make it bold!. You can also "em" to italicize your words.

Normal copy text in base font size 1em with a line-height of 1.5em.

**************************************** Lead / subheader ****************************************

Lead copy / subheadline.copy

Introduction text or lead copy text box with highlights.

The lead class can be added to paragraphs and other html content to highlight. Most used for the introduction text in backend modules.

**************************************** Emphasis ****************************************

Emphasis

Bold

This example includes bold text based on strong html tag.

This example includes bold text based on b htm tag.

Bold font-weight can be gained with strong and b html tag.

Italic

This example includes bold text based on em html tag.

This example includes bold text based on i html tag.

Bold font-weight can be gained with em and i html tag.

Small text

Line of small text

Small text.

**************************************** Links ****************************************

Links

Copy text with embedded link text.

Links are currently not decorated.

Colors

CI
Primary

CI color from the TYPO3 logo and constrast primary color.

**************************************** Typography ****************************************

Previous page «Index» / Next page «Tables»