Insights

Welcome to Our Blog

HarvardSites Design System Insights

The HarvardSites Design System is a collection of tried-and-tested components and design practices for use in building digital products and platforms.

Through this blog, we aim to share insights, practices, and patterns related to the HarvardSites Design System. These contributions are intended to promote greater access and inclusion in our digital world.

Sketch style mockup of icons arranged in a grid representing the HarvardSites Design System

Recent Posts

Why Design Systems Need Guardrails

Typography influences both readability and engagement. As with a musical scale, a typographic scale provides the basis for creating a harmonious visual structure that conveys the structure and relationships among text elements. For the HarvardSites Drupal...

Laurier Cress

An icon that represents aspects of a design system.

Typographic Scale

Typography influences both readability and engagement. As with a musical scale, a typographic scale provides the basis for creating a harmonious visual structure that conveys the structure and relationships among text elements. For the HarvardSites Drupal...

Richard Clinch

 Icon with “Aa” pairs, a line height arrow, and a list of text styles from Heading 1 to body text.

Color System

A robust color system allows each Harvard School to preserve its unique identity while staying connected to the larger Harvard brand. Our approach prioritizes versatility and user needs, enabling personalized branding that meets accessibility and design...

Richard Clinch

A sketch that represents the HarvardSites Design System color assignment.

Autoplaying Hero Background Videos in Digital Design

Autoplaying background videos in hero components have gained popularity in modern web design. Recognizing the need to learn more about this trend in relation to the HarvardSites Design System, the design system team embarked on an investigation to...

Laurier Cress

Mockup of hero component