Web Styles

The new OpenHSU is available as of Spring 2016. It is a Drupal distribution that includes tools and themes that make it easier to create sites that coordinate with the design of the HSU homepage. It also makes it much easier to update and maintain content. OpenHSU is currently being tested with a select number of sites, and more information about it is available by contacting Marketing & Communications at 826-3321.













Primary font: Lato

We use light (300), regular (400), and bold (700). We also include the italic versions of those weights.

Lato can be found at google fonts

Include the font in your html/template files with:
<link href='http://fonts.googleapis.com/css?family=Lato:300,400,700,300italic,400italic,700italic' rel='stylesheet' type='text/css'>
and reference the font in your stylesheets with:
.selector {font-family:'Lato', sans-serif;}

Design & Content Examples

Included with HSU's website platform, OpenHSU.

Image with Caption

Juggling on the Quad

Example of an image with caption created using the spotlight pane.

Examples of Headings:

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5
Heading 6

Type Example:

Page Title

A paragraph lead-in that directly follows a heading. Intended to create additional interest at the beginning of a section.

Typical paragraph. Draws less attention to itself and is intended for easy reading.

Button Examples

Large Buttons

Primary link

Default link

Small Buttons

Primary link

Default link