Re: [community-group] Shadow type feedback (#100)

> > I would love to see an optional opacity or alpha value on the shadow object so that color tokens wouldn't need to be created for each opacity.
> 
> @natemoo-re maybe I'm overgeneralising, but to me it seems that a color part of a shadow is still a color token (even though it's "anonymous" and probably should never be referenced by anyone from the outside), it seems less then ideal to have separate definition mechanisms for the same types of tokens in different contexts.
> 
> Maybe, instead of that, sub-properties for composite tokens' `$value` should allow plain values as a shorthand but generally expect an anonymous token definition (`{ $value, etc... }`); then opacity/alpha/mixing transformation could be defined locally under that anonymous token.
> 
> Here's an example of what I mean (based on a different but similar spec we've been working on for some time at our company):
> 
> ```
> {
>   "color": {
>     "accent": {
>       "$type": "color",
>       "$value": "#000000"
>     }
>   },
>   "shadow-token": {
>     // most Web-compatible implementations would need support for multi-layered shadows,
>     // so this might be "shadowLayer" instead
>     "$type": "shadow",
>     "$value": {
>       "color": {
>         // in our case it's "$value": {"$ref": "color.accent"} instead
>         "$value": "{color.accent}", 
>         "$transforms": [
>           // based on https://www.w3.org/TR/css-color-5/#relative-RGB
>           { "$type": "rgb", args: [{"$name": "alpha", "$value": "88"}] } 
>         ]
>       },
>       "offsetX": "0.5rem",
>       "offsetY": "0.5rem",
>       "blur": "1.5rem",
>       "spread": "0rem"
>     }
>   }
> }
> ```

I don't know how well this fits into the spec, but I love the idea.

With shadows there are typically a lot of one-off colors because you define different layers with different opacities for each shadow and if you add layers on every step of your shadow scale, the opacity values for colors often don't repeat.

Mix this with potentially color shadows, e.g. for danger and success and you get a lot of one-time use colors. Having a simple and easy way to define it in the shadow would be ideal.

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


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

Received on Monday, 7 November 2022 14:50:55 UTC