Meaning of number in Foreground1/2/3 #33782
-
|
In color token naming Foreground, Background and Stroke have a number suffix. Can anyone help me in understanding what the pattern for the number is please? ie is 1 always lighter than 2, and 2 lighter than 3 and so on? I've hunted through but couldn't find any documentation on this. |
Beta Was this translation helpful? Give feedback.
Replies: 1 comment 3 replies
-
|
These are color tokens of our design system. |
Beta Was this translation helpful? Give feedback.
-
|
That's great. Thanks very much for the insight @ValentinaKozlova. Would you welcome a PR to update to that docs page to reflect the information? |
Beta Was this translation helpful? Give feedback.
-
|
Color information is already in the storybook. And |
Beta Was this translation helpful? Give feedback.
-
|
Fair enough. |
Beta Was this translation helpful? Give feedback.
These are color tokens of our design system.
Here's the colors: https://react.fluentui.dev/?path=/docs/theme-colors--docs
Also, you can find all the tokens in dev tools tab
stylesfor.fui-FluentProvider*class when using our components.For background the 1st one is white, the lightest and the 5th one is darkest. And for the foreground the 1st one is the darkest.