Typography
Headers
This is a h1
This is a h2
This is a h3
This is a h4
Text styles
Paragraph text styles
This is a paragraph.
Discreet text style
Added by editors when selecting the Discreet style from the TinyMCE style dropdown, this class allows us to have a text that is discreet with a size of 85% of the normal size for which this class is applied.
Besides the font decrease there is also a contrast filter which dims the color regardless if the primary color is black or white.
This is an example of a paragraph that is discreet.
This is an example of a paragraph that is discreet out of the secondary color.
This is an example of a paragraph that is using the secondary color. Check out the difference in color between this paragraph and the one above it.
Lists
Unstyled lists
- Item 1
- Item 2
Styled lists
Outside of content-core column add list-items class to ul element if you want them to look like those found within content-core.
- Item 1
- Item 2
Bullet lists
This bullet style is used within themes section where the bullet is inside the ul and not outside as regular unordered lists behave.
- Item 1
- Item 2
Inline lists
- Item 1
- Item 2
Unordered lists
This square style is default for lists found within content area, added as a simple ul tag by the TinyMCE editor.
Consider using list-items class on the ul if you want to preserve this style outside of content-core area.
- Item 1
- Item 2
Unordered lists nested
- Item 1
- Item 2
- Item 2.1
- Item 2.2
Ordered lists
- Coffee
- Tea
- Milk
Ordered lists nested
- Coffee
-
Tea
- Black tea
- Green tea
- Milk
Definition lists
Abbreviations
Stylized implementation of the HTML abbr tag for abbreviations and acronyms, showing an expanded version on hover. Abbreviations have a default underline and gain a help cursor to provide additional context on hover.
Quotations
Inline quote
Europe has made considerable progress over recent decades in cleaning the air that we breathe, but air pollution remains a serious problem and continues to damage our health and the environment.
Stavros Dimas, Commissioner for Environment
Pullquote left
Europe has made considerable progress over recent decades in cleaning the air that we breathe, but air pollution remains a serious problem and continues to damage our health and the environment.
Stavros Dimas, Commissioner for Environment
Cursus turpis massa tincidunt dui ut ornare lectus sit amet. Venenatis tellus in metus vulputate eu. Sagittis id consectetur purus ut. Ultricies mi eget mauris pharetra et ultrices. Eu lobortis elementum nibh tellus molestie nunc non blandit massa.
Mattis pellentesque id nibh tortor id aliquet. Amet nisl purus in mollis nunc. Quisque non tellus orci ac auctor augue mauris.
Pullquote right
Europe has made considerable progress over recent decades in cleaning the air that we breathe, but air pollution remains a serious problem and continues to damage our health and the environment.
Stavros Dimas, Commissioner for Environment
Cursus turpis massa tincidunt dui ut ornare lectus sit amet. Venenatis tellus in metus vulputate eu. Sagittis id consectetur purus ut. Ultricies mi eget mauris pharetra et ultrices. Eu lobortis elementum nibh tellus molestie nunc non blandit massa.
Mattis pellentesque id nibh tortor id aliquet. Amet nisl purus in mollis nunc. Quisque non tellus orci ac auctor augue mauris. Faucibus vitae aliquet nec ullamcorper sit amet risus nullam eget.
Permalinks
- Permalink to this version
- 79d0f9bfcfb2406da298e2ac86a299aa
- Permalink to latest version
- U3Q9B87CS5
Geographic coverage
For references, please go to https://www.eea.europa.eu/code/design-elements/typography or scan the QR code.
PDF generated on 04 Mar 2021, 11:33 AM
Document Actions
Share with others