HTML uses 6 heading styles to to create structure for your content. Google and other search engines use heading styles and their content as ranking factors. The text or phrase in your Heading 1 (HTML <h1>) tag is considered more important than the content of your Heading 2 (<h2>). Strict HTML validation will fail if the styles are used out of order.
Your template is configured with default styles for all 6 headings. These styles include accommodations for responsive design and smaller screen sizes and specify not only the font and weight, but the line height and space between them and other content.
This is obviously the default paragraph (HTML <p>) content. It is possible to have specific styles for other regular elements. We recommend a single font & style for all default content and if you have special cases use a custom class as detailed below.
The <p> style determines not only the font used, but also the line height, the space between paragraphs, and of course, how it changes for smaller screens.
Testing the preformatted <pre> tag. Testing the preformatted <pre> tag. Testing the preformatted <pre> tag.
.color-accent-1
This is a paragraph with the same custom class.
.color-accent-2
This is a paragraph with the accent color applied to part of it.
.color-tertiary
This is handy for form submissions.
.color-success
.color-warning
.color-alert
.color-lightgray
.color-mediumgray
.color-darkgray
.color-default-reversed
.color-disabled-reversed