Typography
Name
Value
Description
Font Family
Council on Urban Verticalism
--font-family-heading
Council on Urban Verticalism
--font-family-body
Council on Urban Verticalism
--font-family-caption
Council on Urban Verticalism
--font-family-eyebrow
Council on Urban Verticalism
--font-family-label
Council on Urban Verticalism
--font-family-quote
Desktop Font Size
Council on Urban Verticalism
--desktop-font-size-5xl
56px
Council on Urban Verticalism
--desktop-font-size-4xl
48px
Council on Urban Verticalism
--desktop-font-size-3xl
36px
Council on Urban Verticalism
--desktop-font-size-2xl
28px
Council on Urban Verticalism
--desktop-font-size-xl
22px
Council on Urban Verticalism
--desktop-font-size-lg
20px
Council on Urban Verticalism
--desktop-font-size-md
18px
Council on Urban Verticalism
--desktop-font-size-sm
16px
Council on Urban Verticalism
--desktop-font-size-xs
14px
Council on Urban Verticalism
--desktop-font-size-2xs
12px
Mobile Font Size
Council on Urban Verticalism
--mobile-font-size-5xl
40px
Council on Urban Verticalism
--mobile-font-size-4xl
32px
Council on Urban Verticalism
--mobile-font-size-3xl
28px
Council on Urban Verticalism
--mobile-font-size-2xl
24px
Council on Urban Verticalism
--mobile-font-size-xl
20px
Council on Urban Verticalism
--mobile-font-size-lg
18px
Council on Urban Verticalism
--mobile-font-size-md
16px
Council on Urban Verticalism
--mobile-font-size-sm
14px
Council on Urban Verticalism
--mobile-font-size-xs
12px
Font Weight
Council on Urban Verticalism
--font-weight-regular
Council on Urban Verticalism
--font-weight-medium
Council on Urban Verticalism
--font-weight-semibold
Council on Urban Verticalism
--font-weight-bold
Letter Spacing
Council on Urban Verticalism
--letter-spacing-3xs
Council on Urban Verticalism
--letter-spacing-2xs
Council on Urban Verticalism
--letter-spacing-xs
Council on Urban Verticalism
--letter-spacing-sm
Council on Urban Verticalism
--letter-spacing-md
Council on Urban Verticalism
--letter-spacing-lg
Council on Urban Verticalism
--letter-spacing-xl
Council on Urban Verticalism
--letter-spacing-2xl
Council on Urban Verticalism
--letter-spacing-3xl
Classes
Warning: foreach() argument must be of type array|object, null given in /home/forge/cvu-designsystem.multipleinc.com/web/wp-content/themes/multiple2k23/components/tables/property-table-row.php on line 8
Desktop Typography
We are building tall better.
.heading-sm
font-family: var(--font-family-heading);
font-size: var(--desktop-font-size-xl);
letter-spacing: var(--letter-spacing-2xs);
/* line-height: var(); */
/* font-weight: var(); */
font-family: var(--font-family-heading);
font-size: var(--desktop-font-size-xl);
letter-spacing: var(--letter-spacing-2xs);
/* line-height: var(); */
/* font-weight: var(); */
We are building tall better.
.heading-md
font-family: var(--font-family-heading);
font-size: var(--desktop-font-size-2xl);
letter-spacing: var(--letter-spacing-xs);
/* font-weight: var(); */
/* line-height: var(); */
font-family: var(--font-family-heading);
font-size: var(--desktop-font-size-2xl);
letter-spacing: var(--letter-spacing-xs);
/* font-weight: var(); */
/* line-height: var(); */
We are building tall better.
.heading-lg
font-family: var(--font-family-heading);
font-size: var(--desktop-font-size-3xl);
letter-spacing: var(--letter-spacing-xs);
/* font-weight: var(); */
/* line-height: var(); */
font-family: var(--font-family-heading);
font-size: var(--desktop-font-size-3xl);
letter-spacing: var(--letter-spacing-xs);
/* font-weight: var(); */
/* line-height: var(); */
We are building tall better.
.heading-xl
font-family: var(--font-family-heading);
font-size: var(--desktop-font-size-4xl);
letter-spacing: var(--letter-spacing-xs);
/* font-weight: var(); */
/* line-height: var(); */
font-family: var(--font-family-heading);
font-size: var(--desktop-font-size-4xl);
letter-spacing: var(--letter-spacing-xs);
/* font-weight: var(); */
/* line-height: var(); */
We are building tall better.
.heading-2xl
font-family: var(--font-family-heading);
font-size: var(--desktop-font-size-5xl);
letter-spacing: var(--letter-spacing-2xs);
/* font-weight: var(); */
/* line-height: var(); */
font-family: var(--font-family-heading);
font-size: var(--desktop-font-size-5xl);
letter-spacing: var(--letter-spacing-2xs);
/* font-weight: var(); */
/* line-height: var(); */
We are building tall better.
.body-xs
font-family: var(--font-family-body);
font-size: var(--desktop-font-size-xs);
letter-spacing: var(--letter-spacing-lg);
/* font-weight: var(); */
/* line-height: var(); */
font-family: var(--font-family-body);
font-size: var(--desktop-font-size-xs);
letter-spacing: var(--letter-spacing-lg);
/* font-weight: var(); */
/* line-height: var(); */
We are building tall better.
.body-sm
font-family: var(--font-family-body);
font-size: var(--desktop-font-size-sm);
letter-spacing: var(--letter-spacing-lg);
/* font-weight: var(); */
/* line-height: var(); */
font-family: var(--font-family-body);
font-size: var(--desktop-font-size-sm);
letter-spacing: var(--letter-spacing-lg);
/* font-weight: var(); */
/* line-height: var(); */
We are building tall better.
.body-md
font-family: var(--font-family-body);
font-size: var(--desktop-font-size-md);
letter-spacing: var(--letter-spacing-lg);
/* font-weight: var(); */
/* line-height: var(); */
font-family: var(--font-family-body);
font-size: var(--desktop-font-size-md);
letter-spacing: var(--letter-spacing-lg);
/* font-weight: var(); */
/* line-height: var(); */
We are building tall better.
.body-lg
font-family: var(--font-family-body);
font-size: var(--desktop-font-size-lg);
letter-spacing: var(--letter-spacing-md);
/* font-weight: var(); */
/* line-height: var(); */
font-family: var(--font-family-body);
font-size: var(--desktop-font-size-lg);
letter-spacing: var(--letter-spacing-md);
/* font-weight: var(); */
/* line-height: var(); */
We are building tall better.
.body-xl
font-family: var(--font-family-body);
font-size: var(--desktop-font-size-xl);
letter-spacing: var(--letter-spacing-xs);
/* font-weight: var(); */
/* line-height: var(); */
font-family: var(--font-family-body);
font-size: var(--desktop-font-size-xl);
letter-spacing: var(--letter-spacing-xs);
/* font-weight: var(); */
/* line-height: var(); */
We are building tall better.
.eyebrow-sm
font-family: var(--font-family-eyebrow);
font-size: var(--desktop-font-size-2xs);
letter-spacing: var(--letter-spacing-lg);
/* font-weight: var(); */
/* line-height: var(); */
font-family: var(--font-family-eyebrow);
font-size: var(--desktop-font-size-2xs);
letter-spacing: var(--letter-spacing-lg);
/* font-weight: var(); */
/* line-height: var(); */
We are building tall better.
.eyebrow-md
font-family: var(--font-family-eyebrow);
font-size: var(--desktop-font-size-xs);
letter-spacing: var(--letter-spacing-lg);
/* font-weight: var(); */
/* line-height: var(); */
font-family: var(--font-family-eyebrow);
font-size: var(--desktop-font-size-xs);
letter-spacing: var(--letter-spacing-lg);
/* font-weight: var(); */
/* line-height: var(); */
We are building tall better.
.eyebrow-lg
font-family: var(--font-family-eyebrow);
font-size: var(--desktop-font-size-sm);
letter-spacing: var(--letter-spacing-lg);
/* font-weight: var(); */
/* line-height: var(); */
font-family: var(--font-family-eyebrow);
font-size: var(--desktop-font-size-sm);
letter-spacing: var(--letter-spacing-lg);
/* font-weight: var(); */
/* line-height: var(); */
We are building tall better.
.label-md
font-family: var(--font-family-label);
font-size: var(--desktop-font-size-xs);
letter-spacing: var(--letter-spacing-lg);
/* font-weight: var():
line-height: var(); */
font-family: var(--font-family-label);
font-size: var(--desktop-font-size-xs);
letter-spacing: var(--letter-spacing-lg);
/* font-weight: var():
line-height: var(); */
We are building tall better.
.quote-md
font-family: var(--font-family-quote);
font-size: var(--desktop-font-size-md);
letter-spacing: var(--letter-spacing-lg);
font-weight: var(--font-weight-semibold);
line-height: var(--line-height-xxl);
font-style: italic;
font-family: var(--font-family-quote);
font-size: var(--desktop-font-size-md);
letter-spacing: var(--letter-spacing-lg);
font-weight: var(--font-weight-semibold);
line-height: var(--line-height-xxl);
font-style: italic;
We are building tall better.
.caption-md
font-family: var(--font-family-caption);
font-size: var(--desktop-font-size-2xs);
letter-spacing: var(--letter-spacing-lg);
/* font-weight: var(); */
/* line-height: var(); */
font-family: var(--font-family-caption);
font-size: var(--desktop-font-size-2xs);
letter-spacing: var(--letter-spacing-lg);
/* font-weight: var(); */
/* line-height: var(); */
We are building tall better.
.caption-lg
font-family: var(--font-family-caption);
font-size: var(--desktop-font-size-xs);
letter-spacing: var(--letter-spacing-lg);
/* font-weight: var(); */
/* line-height: var(); */
font-family: var(--font-family-caption);
font-size: var(--desktop-font-size-xs);
letter-spacing: var(--letter-spacing-lg);
/* font-weight: var(); */
/* line-height: var(); */
Mobile Typography
We are building tall better.
.heading-sm
font-family: var(--font-family-heading);
font-size: var(--mobile-font-size-xl);
letter-spacing: var(--letter-spacing-md);
/* line-height: var(); */
/* font-weight: var(); */
font-family: var(--font-family-heading);
font-size: var(--mobile-font-size-xl);
letter-spacing: var(--letter-spacing-md);
/* line-height: var(); */
/* font-weight: var(); */
We are building tall better.
.heading-md
font-family: var(--font-family-heading);
font-size: var(--mobile-font-size-2xl);
letter-spacing: var(--letter-spacing-xs);
/* font-weight: var(); */
/* line-height: var(); */
font-family: var(--font-family-heading);
font-size: var(--mobile-font-size-2xl);
letter-spacing: var(--letter-spacing-xs);
/* font-weight: var(); */
/* line-height: var(); */
We are building tall better.
.heading-lg
font-family: var(--font-family-heading);
font-size: var(--mobile-font-size-3xl);
letter-spacing: var(--letter-spacing-xs);
/* font-weight: var(); */
/* line-height: var(); */
font-family: var(--font-family-heading);
font-size: var(--mobile-font-size-3xl);
letter-spacing: var(--letter-spacing-xs);
/* font-weight: var(); */
/* line-height: var(); */
We are building tall better.
.heading-xl
font-family: var(--font-family-heading);
font-size: var(--mobile-font-size-4xl);
letter-spacing: var(--letter-spacing-xs);
/* font-weight: var(); */
/* line-height: var(); */
font-family: var(--font-family-heading);
font-size: var(--mobile-font-size-4xl);
letter-spacing: var(--letter-spacing-xs);
/* font-weight: var(); */
/* line-height: var(); */
We are building tall better.
.body-xs
font-family: var(--font-family-body);
font-size: var(--mobile-font-size-xs);
letter-spacing: var(--letter-spacing-lg);
/* font-weight: var(); */
/* line-height: var(); */
font-family: var(--font-family-body);
font-size: var(--mobile-font-size-xs);
letter-spacing: var(--letter-spacing-lg);
/* font-weight: var(); */
/* line-height: var(); */
We are building tall better.
.body-sm
font-family: var(--font-family-body);
font-size: var(--mobile-font-size-sm);
letter-spacing: var(--letter-spacing-lg);
/* font-weight: var(); */
/* line-height: var(); */
font-family: var(--font-family-body);
font-size: var(--mobile-font-size-sm);
letter-spacing: var(--letter-spacing-lg);
/* font-weight: var(); */
/* line-height: var(); */
We are building tall better.
.body-md
font-family: var(--font-family-body);
font-size: var(--mobile-font-size-md);
letter-spacing: var(--letter-spacing-lg);
/* font-weight: var(); */
/* line-height: var(); */
font-family: var(--font-family-body);
font-size: var(--mobile-font-size-md);
letter-spacing: var(--letter-spacing-lg);
/* font-weight: var(); */
/* line-height: var(); */
We are building tall better.
.body-lg
font-family: var(--font-family-body);
font-size: var(--mobile-font-size-lg);
letter-spacing: var(--letter-spacing-md);
/* font-weight: var(); */
/* line-height: var(); */
font-family: var(--font-family-body);
font-size: var(--mobile-font-size-lg);
letter-spacing: var(--letter-spacing-md);
/* font-weight: var(); */
/* line-height: var(); */
We are building tall better.
.body-xl
font-family: var(--font-family-body);
font-size: var(--mobile-font-size-xl);
letter-spacing: var(--letter-spacing-md);
/* font-weight: var(); */
/* line-height: var(); */
font-family: var(--font-family-body);
font-size: var(--mobile-font-size-xl);
letter-spacing: var(--letter-spacing-md);
/* font-weight: var(); */
/* line-height: var(); */
We are building tall better.
.eyebrow-md
font-family: var(--font-family-eyebrow);
font-size: var(--mobile-font-size-xs);
letter-spacing: var(--letter-spacing-lg);
/* font-weight: var(); */
/* line-height: var(); */
font-family: var(--font-family-eyebrow);
font-size: var(--mobile-font-size-xs);
letter-spacing: var(--letter-spacing-lg);
/* font-weight: var(); */
/* line-height: var(); */
We are building tall better.
.eyebrow-lg
font-family: var(--font-family-eyebrow);
font-size: var(--mobile-font-size-sm);
letter-spacing: var(--letter-spacing-lg);
/* font-weight: var(); */
/* line-height: var() */
font-family: var(--font-family-eyebrow);
font-size: var(--mobile-font-size-sm);
letter-spacing: var(--letter-spacing-lg);
/* font-weight: var(); */
/* line-height: var() */
We are building tall better.
.label-md
font-family: var(--font-family-label);
font-size: var(--mobile-font-size-xs);
letter-spacing: var(--letter-spacing-lg);
/* font-weight: var():
line-height: var(); */
font-family: var(--font-family-label);
font-size: var(--mobile-font-size-xs);
letter-spacing: var(--letter-spacing-lg);
/* font-weight: var():
line-height: var(); */
We are building tall better.
.quote-md
font-family: var(--font-family-quote);
font-size: var(--mobile-font-size-md);
letter-spacing: var(--letter-spacing-lg);
/* font-weight: var(); */
/* line-height: var() */
font-family: var(--font-family-quote);
font-size: var(--mobile-font-size-md);
letter-spacing: var(--letter-spacing-lg);
/* font-weight: var(); */
/* line-height: var() */
We are building tall better.
.caption-lg
font-family: var(--font-family-caption);
font-size: var(--mobile-font-size-xs);
letter-spacing: var(--letter-spacing-lg);
/* font-weight: var(); */
/* line-height: var(); */
font-family: var(--font-family-caption);
font-size: var(--mobile-font-size-xs);
letter-spacing: var(--letter-spacing-lg);
/* font-weight: var(); */
/* line-height: var(); */
Directions:
- Select the desired class from the second dropdown menu.
- Type your text and press Enter to create a new line.
- On a new line, ensure both dropdown menus revert to 'Paragraph'. If not, unselect the previously chosen class before typing or selecting a new class.
- Select the next typestyle class you want to use.
- If the new class appears the same as the previous one, both classes may be assigned to the same text element.
- Click the '< >' button in the menu to open the source code modal.
- Locate the targeted text element and remove all classes except the desired one.