Congratulations on your new website! Here is a reference guide to help you visualize what will display on the front-end of your website when you make updates. If you have any questions, feel free to contact us at support@email.com.
FONTS USED IN WEBSITE
It’s important to be consistent with font (and color) use across all marketing channels. Here are the two typefaces and their fonts that are being used throughout the site, with links to purchase licenses for use outside of the website. The license for website usage is covered under Status Forward’s Adobe Creative Cloud subscription, nowhere else.
Muli: https://fonts.google.com/specimen/Muli
This is the sans-serif font. We used “black” for the logo, and “black”, “bold”, “regular” and “regular italic” for select body copy and most headlines throughout the website.
Poppins: https://fonts.google.com/specimen/Poppins
This is the slab-serif font. We used “bold”, “regular” and “regular italic” fonts for most body copy, some headlines and navigation throughout the website.
HEADLINES
This is an H1 headline
H1 headlines are only used for page and post titles and are automatically generated by the system. You should never need to insert an H1 into your page or post.
THIS IS AN H2 HEADLINE
I am a smaller H3 Headline
THIS IS AN H4 HEADLINE
THIS IS AN H5 HEADLINE
This is an h6 headline
BODY COPY
This is how body copy looks throughout the website. Lorem ipsum dolor sit amet, consectetur elit. I am a text link in eros elementum tristique. I am bold text, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.
INTRO BODY COPY: USE STYLE “INTRO” IN ADDITIONAL CSS CLASS FIELD.
This is example lead-in text that is set apart from the body copy. It is often used at the start of a page to lead visitors into the content.
COLORS USED SITE-WIDE
2d445c
455769
ed7c31
4b5e65
444444
ffffff
BLOCKQUOTE
“This is a block quote. Aenean quam. In scelerisque sem at dolor. Maecenas mattis. Sed convallis tristique sem. Proin ut ligula vel nunc egestas porttitor. Morbi lectus risus, iaculis vel, suscipit quis, luctus non, massa. Fusce ac turpis quis ligula lacinia aliquet.”
PULL QUOTE DEFAULT
“Pull Quote ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare”
CITATION – WHO’S IT BY
PULL QUOTE DEFAULT
“Pull Quote ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare”
CITATION – WHO’S IT BY
BUTTONS – TEXT LINK WITH STYLE .BUTTON & CONTENT EDITOR BUTTON (SAME STYLE)
SEPARATORS: DEFAULT (SHORT), DOTS, AND WIDE
LISTS: BULLET STYLE AND NUMBERED STYLE
- Aenean faucibus nibh et justo cursus id rutrum
- Dolor sit amet consectetur adipiscing
- Eros dolor interdum nulla ut commodo
- Aenean faucibus nibh et justo cursus id rutrum
- Dolor sit amet consectetur adipiscing
- Eros dolor interdum nulla ut commodo
ACCORDIONS
FREQUENTLY ASKED QUESTIONS
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.
PAGE LAYOUTS
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.
