Consider including `font` shorthand for CSS custom properties

[jonathantneal]

In the current CSS export of tokens, providing font styles to an element can feel lengthy and prone to error.

.hypothetical-example-based-on-applying-font-body-1 {
  font-family: var(--font-body-1-font-family);
  font-size: var(--font-body-1-font-size);
  font-weight: var(--font-body-1-font-weight);
  letter-spacing: var(--font-body-1-letter-spacing);
  line-height: var(--font-body-1-line-height);
}

The verbosity can be reduced from 5 lines to 2 lines by providing a token for the font property.

.hypothetical-example-based-on-applying-font-body-1 {
  font: var(--font-body-1);
  letter-spacing: var(--font-body-1-letter-spacing);
}

Such a token would look something like this:

.hypothetical-root {
  --font-body-1: 400 1rem/var(--font-body-1-line-height) var(--font-body-1-font-family);
}

[markacianfrani]

Would there be any value in having just the --font-body-1-font-family --font-body-1-font-size etc tokens then? Or should we just ship --font-body-1 ? Letter spacing is the odd one out here though.

which makes me think maybe utility classes are the way to go here?