Colors
The website incorporates the following color rules from page 3 of the brand standards.
- We used Samford's primary colors, blue and red, prominently throughout the design.
- We used Samford's digital secondary colors, gray and sky blue as accent colors.
- We used Pantone's official hexidecimal (#0C2340) or RGB (12, 35, 64) equivalent when representing Samford's primary blue (Pantone Matching System 289).
- We used hexidecimal (#BD1F2D) or RGB (189, 31, 45) equivalent when representing Samford's primary red (Pantone Matching System 200).
- We used Pantone's official hexidecimal (#64CCC9) or RGB (100, 204, 201) equivalent when representing secondary color Sky Blue (Pantone Matching System 325).
Fonts
The website incorporates the following typography rules from page 4 of the brand standards.
- We used Chronicle Deck Bold for display text like page titles, quotes, calls to action, information graphics and headlines throughout the site.*
- We used Whitney Book for body copy and captions throughout the site.*
*While all modern browsers on Android, iOS, Linux, MacOS and Windows support web fonts, Georgia has been substituted as a fallback font for Chronicle Deck Bold and Tahoma has been substituted as a fallback font forWhitney Book on older systems that do not support web fonts.
Logos
The website incorporates the following logo rules from pages 6-12 of the brand standards.
- We used the horizontal wordmark in lieu of the bell tower logo (page 6).
- We left at least 18 pixels (screen equivalent of .25") around the logo to meet the clear zone requirements (page 7).
- We set the logo height at 72 pixels resulting in a logo width between 292 and 345-pixels wide--which is greater than the 72-pixel minimum width requirement (page 8).
- We chose to use the white wordmark on a dark blue background (page 9).
- We chose to use school-specific white wordmarks on a dark blue background for the school sites (page 10).
- We did not use school or college crossover marks for electronic (page 12).
Styles
This is a paragraph.
This is a blockquote.Attribution inside a blockquote.
Heading 1
Heading 2
Heading 3
Heading 4
Heading 5
Heading 6
Buttons
Content Boxes
Blue Content Box
Gray Content Box
Red Content Box
Tables
Label 1 | Label 2 |
---|---|
Row 1 Column 1 | Row 1 Column 2 |
Row 2 Column 1 | Row 2 Column 2 |
Row 3 Column 1 | Row 3 Column 2 |
Templates
Grid System
To make it as easy as possible to create pleasing layouts with a variety of content, Samford's templating system is based on a twelve-column grid arranged in rows. To use the system, simply create a row container and add column containers specifying each container's relative size by declaring the corresponding col class (i.e. onecol, twocol, threecol, fourcol, fivecol, sixcol, sevencol, eightcol, ninecol, tencol, elevencol, twelvecol). The columns in each row must add up to total of 12. The final column in the row must include the class last.
Content Design Library
In addition to providing cascading styles and the grid system, we have created a robust content design library to provide ideas for presenting your content.
Content Box Title