Headings

Primary headings are all set in Roboto with a weight of 700 (bold). Alignment is flush left.The primary head color is darkGray #26292C.

Secondary and tertiary headings are also darkGray when on a neutral or whtie background. For dark primary1 (brand dark) they should be set in white #FFF.

H1: Green, gold, and bold

H2: Green, gold, and bold

H3: Green, gold, and bold

H4: Green, gold, and bold

H5: Green, gold, and bold
H6: Green, gold, and bold

H1 display heading

Explore our Academic Ecosystem

/* h-dt/h1 display serif */

font-family: Lora;
font-size: 54px; f
ont-style: normal;
font-weight: 600;
line-height: 60px; / 111.111%
letter-spacing: -1px;

/* h-dt/h1 display serif */



H2 Heading style

Explore our Academic Ecosystem this is an H2 heading and it is a bit long so we can test the lineheight.

/* h-dt/h2 */

font-family: Roboto; 
font-size: 32px; font-style: normal; 
font-weight: 700; 
line-height: 45px; / 1.5% */
letter-spacing: -0.18px;

H3 Heading style

Explore our Academic Ecosystem this is an H3 heading and it is a bit long so we can test the lineheight.

color: var(--type-body-type-colors-heading-styles-darkGray, #26292C);
/* h-dt/h3 / 
font-family: Roboto; 
font-size: 26px; font-style: normal; 
font-weight: 700; 
line-height: 39px; / 1.5% */
letter-spacing: -0.18px;

H4 heading style

Explore our Academic Ecosystem

color: var(--type-body-type-colors-heading-styles-darkGray, #26292C);
/* h-dt/h4 / 
font-family: Roboto; 
font-size: 19px; 
font-style: normal; 
font-weight: 700; 
line-height: 24px; / 126.316% */
letter-spacing: -0.18px;

H5 heading style

Explore our Academic Ecosystem
color: var(--type-body-type-colors-heading-styles-darkGray, #26292C);
/* h-dt/h5 / 
font-family: Roboto; 
font-size: 18px; 
font-style: normal; 
font-weight: 700; 
line-height: 22px; / 122.222% */
letter-spacing: -0.18px;
H6 heading style
Explore our Academic Ecosystem
color: var(--type-body-type-colors-heading-styles-darkGray, #26292C);
/* h-dt/h6 / 
font-family: Roboto; 
font-size: 16px; 
font-style: normal; 
font-weight: 700; 
line-height: 20px; / 125% */
letter-spacing: -0.18px;

Weights

Roboto headings are bold, weight 700.

Lora headings are semibold, weight 600.

Color

Headings are daryGray #26292C.
color: var(–type-body-type-colors-heading-styles-darkGray, #26292C);