---
title: Typography
date: 2024-03-13T19:09:00-07:00
author: Max Escher
canonical_url: "https://designsystem.umd.edu/foundation/typography"
section: Foundation
---
[Foundation](https://designsystem.umd.edu/foundation)

#  Typography 

 

 ![Letter "A" in many different fonts and styles](https://umd-design.transforms.svdcdn.com/production/images/typography_2025-04-02-185632_coxa.png?w=1728&h=1120&auto=compress%2Cformat&fit=crop&dm=1743620226&s=277e4d67410af56d189cc0507036db71) 

  

   ##  Aa 

  Interstate  [  Download ](https://fonts.adobe.com/fonts/interstate) 

 Aa

Bold (700) is used in headers for smaller components and text content. It is also used in buttons. All caps is used in eyebrows/overline text

 

 Aa

Regular (400) is used in body copy, captions, labels

 

 Aa

Black (800), all caps is used in large component headers

 

 

 

  ##  Aa 

  Barlow Condensed  [  Download ](https://fonts.google.com/specimen/Barlow+Condensed) 

 Aa

Bold Italic all caps is used in most hero titles

 

 Aa

Bold Italic is used in stats

 

 

 

  

 

  ##  When to use which font 

 - The Fearlessly Forward style of type, all caps condensed italic, is only used in stats and in landing and homepage heroes.
- Interstate is used for all text aside from stats and hero titles. If a free alternative to Interstate is required, [Overpass](https://fonts.google.com/specimen/Overpass) may be used.

 

   ##  Background and color 

 - On white and light gray backgrounds, titles are Maryland Black color and body copy is Dark Gray, see [Color](https://designsystem.umd.edu/foundation/color).
- Body copy on a white or light gray background should never be set in black.
- On dark backgrounds, titles and copy should be set in Maryland White.

 

   ##  Case and style 

 Follow University of Maryland [style recommendations](https://brand.umd.edu/editorial-style-guidelines) when setting copy.

 

   ##  Responsive type sizing 

 The type scale updates for mobile and provides responsive equivalents. Generally the sizing should update on a standard tablet portrait screen size.

  [ See Type Mapping ](https://designsystem.umd.edu/foundation/type-mapping)
