Re: [community-group] [RFC] Format specification (#1)

👋 Hey there folks. I'm a designer for [Adobe's Spectrum](https://spectrum.adobe.com/) and have been maintaining our token system for the past few years. I'm also the creator of [Leonardo](https://leonardocolor.io), which is a tool for generating colors based on desired contrast ratios.

So much of this thread is spot on. I have a few thoughts to add. 
1. Cross-referencing tokens is necessary, but may not need to be part of this scope
2. Contextual changes to token values are also necessary, but may be out of this scope depending on how it's handled. I see 'contextual changes' as akin to "themes", which can encompass color changes, size value changes, and combinations of font, color, and size changes for any given context. (ie "color theme" changes color, "scale" changes sizes, "locale" changes font/size/colors)

Something that seems suggested but not fully articulated is the notion that tokens may act as configurations for outputting values. @c1rrus mention of type scales is a good example. One may see the output of each font size *as* the tokens, however the core set of tokens that define those values are computed from the base font size & multiplier.
```
base-font-size: 14px;
type-scale-multiplier: 1.125;

// outputs:
font-size-100: 14px;
font-size-200: 16px;
font-size-300: 18px;
...
```
It's worth noting that constraints are still required in this use case, in order to ensure consistent naming of the output tokens (`font-size-100`) as well as how large/small they go. For example, you would not likely wish to output a `5px` font size, even though it conforms to the base font + multiplier.

What appears to be the topic in question would be w/r/t whether the output tokens are stored in the token library, how naming is handled (generated?), etc. I believe cross-references and calculations will help resolve this. As @mirisuzanne said 

> "If I can't capture real relationships, it doesn't feel like a system "

So this could be:
```
base-font-size: 14px;
type-scale-multiplier: 1.125;

// outputs:
font-size-100: base-font-size;
font-size-200: base-font-size * type-scale-multiplier;
font-size-300: base-font-size * (type-scale-multiplier * 2);
...
```
Note: the above examples are only illustrating concept of input/output tokens, not an opinion on the structure.

-- 
GitHub Notification of comment by NateBaldwinDesign
Please view or discuss this issue at https://github.com/design-tokens/community-group/issues/1#issuecomment-577827457 using your GitHub account

Received on Thursday, 23 January 2020 19:05:36 UTC