U of M Homesite Style Tile

This style tile includes common, base styles determined as part of the University of Minnesota Twin Cities homepage redesign in 2014. Please contact urweb@umn.edu with any questions.

Color

A light color palette is used. The foreground and background color combinations listed meet or exceed WCAG 2.0 level AA conformance for large text sizes, defined as 18px or larger (18px being the base text size in this style tile; only code examples are smaller). All combinations listed also meet or exceed WCAG 2.0 level AA conformance for normal text sizes except for the sunny and medium gray background colors.

The default text color is “stormy” (#404d5b). Third-level headings and down (h3–h6) use “medium gray” (#8a8a8a).

Typography

We use Raleway as the primary typeface throughout the site, using a single font stack (excluding <pre> and similar elements/styles that may call for monospaced fonts). We rely on the full range of font-weight levels (100-900) available for Raleway (using only 400–600 in this style tile) along with line-height and letter-spacing to work with a single typeface. Common, sans-serif fonts follow in the stack; there is no serif or alternative stack.

font-family: 'Raleway', Helvetica, 'Helvetica Neue', 'Futura', Verdana, 'Geneva', sans-serif

Headings

Heading font-size ranges from 1–2em (18–36px). All headings use line-height: 1.35em, letter-spacing: 0.025em, and have font-weight: 400 unless otherwise specified.

  1. Heading 1 (36px)
  2. Heading 2 (27px)
  3. Heading 3 (24.75px)
  4. Heading 4 (22.5px)
  5. Heading 5 (20.25px font-weight: 500)
  6. Heading 6 (18px, font-weight: 600)

Body Text

For standard body text we use a large base font-size of 18px (font-size: 112.5%). Body text—and text in general—use line-height: 1.35em and letter-spacing: 0.025em.