Re: [community-group] Pre-defined composite type for refering color modifications (e.g. rgba) (#88)

At EA our `color` tokens support either providing a `string` value for the standard use case, an object for adjusting opacity, or an object for calculated colors. 

Opacity adjustments like this:
```
{
  “some-color”: {
    “type”: “color”,
    “value”: {
      “color”: “{colors.another-color}”,
      “alpha”: 0.85
    }
  }
}
```
Though we don’t support it in our token system, this approach could be used in conjunction with transitive transforms so any aliased relationships are maintained through token output, like so in CSS:
```
—some-color: rgba(—colors-another-color, 0.85);
```

Calculated colors look something like this:
```
{
  “some-color”: {
    “type”: “color”,
    “value”: {
      “color”: “{colors.another-color}”,
      “operations”: [
        { “hue”: -20 },
        { “lightness”: 5 },
        { “saturation”: 13 }
      ]
    }
  }
}
```
The calculated colors `operations` property accepts a custom token type of `color-operations` so we can tokenize the operation set and (basically they behave as curried functions) that we can reuse throughout our token themes.

Unlike the alpha adjustments, I don’t think color operations can carry through transitively to token output. 
        

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


-- 
Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config

Received on Friday, 4 February 2022 11:32:44 UTC