Introducing a Modern Design System

Our new design meets a wide variety of demands across Stanford Medicine. The design builds and enforces Stanford Medicine as a preeminent brand and allows the flexibility for organizations to build sites with unique needs.

Stanford Medicine on Every Device

People access our digital presence from every imaginable device. Smartphone, tablet, notebook, desktop - no matter what people use, the design will adapt to present navigation and content in a way the offers an excellent user experience.

The new Stanford Medicine designs are sharp and render faster. We use vector and font-based graphics and icons to minimize load times and provide crystal clarity devices of any size.

Modern Aesthetic

The new Stanford Medicine design is a visual system of themes and design patterns that enable our brand and missions in a contemporary and fresh way. The pages and components look incredible on devices of all sizes.

Clean Typography

The new system uses a set of three typefaces (Source Sans Pro, Fjord, and Crimson Text) that provide simple, easy-to-read text that is optimized for viewing on all devices. They are all free, open source fonts available from Google Web Fonts.

Fully Accessible

The design, navigation, and content is being developed to meet a high standard of accessibility so that our content is available to everyone. We audit the pages and site to meet the standards. We participate with Stanford's accessibility program to help make this a success.


The Colors of Stanford Medicine

A new, high-impact color palette links the design to Stanford legacy colors and provides an extended color set to build inviting sites.


Choice of Themes

The design is offered through a set of themes and a toolkit for building custom sites. Each theme will be set at the site level and be selected when a site is requested. Each theme is a fully responsive, browser compatible, and is tested to meet accessibility goals.


Everest

This theme is based on the top-tier general use pages. The navigation is a three tier vertical layout. 

McKinley

This theme offers a flexible horizontal navigation system with a wide canvas for content. 

K2 (custom toolkit)

This is a toolkit with design elements approved for digital use that can be combined creatively to build custom  sites.  

K2 is not available for general use. This is a custom template used for sites that require special needs.