Quick Style Guide
This page is meant to provide examples of how assets on this site should be used.
Typography
Please use the pre-programmed styles in the Squarespace “Design” section. Please do not modify these styles. As a general rule, the hierarchy should be as follows:
Headline 1
Headline 2
Headline 3
Body Copy
Note: When copy exceeds 3 lines of text, it is usually best to left-justify paragraph for ease of readability.
When creating blocks of text that are representing multiple sections of copy, or are linked to calls to action, make sure copy is left-aligned, as well as uses an H3 style for headline copy paired with body copy.
Buttons
Buttons come in 3 sizes, small, medium and large. The should be used according to priority of CTA on the entire page. For example, if there is only one button on the page, use the large; if there are multiples, make the most important CTA large.
Images & Photography
Each page should have a banner with a background image and a title overlay. In order to upload this, you need to upload the photo in the Settings section of the respective page. See example below for proper usage.
When creating a page, make sure the header banner is a single photo that is large enough to fill screen. Main text should overlay the photo. This can be recreated by typing text in the Page Description area of an index page. You must bold whatever text you intend to be the headline.
Iconography
Icons are intended to reinforce a piece of information, or a series of points. Any supplemental icons created should follow the monolinear style similar to that of icons below.
Graphics
Below are some samples of pattern graphics that may be used as section breaks on content-heavy pages.
