Theemo

Appearance

Theemo / @theemo/style-dictionary / colorCssLightDarkTransform

Variable: colorCssLightDarkTransform ​

ts
const colorCssLightDarkTransform: Transform;

Defined in: transforms/color-css-light-dark.ts:86

Will turn your token into the CSS light-dark() function, when a token supports light and dark color-scheme constraint.

Example ​

Turning this:

json
{
  "$value": [
    {
      "value": "#12544a",
      "features": {
        "color-scheme": "light"
      }
    },
    {
      "value": "#80e5d6",
      "features": {
        "color-scheme": "dark"
      }
    }
  ],
  "$type": "color"
}

Into:

css
:root {
  --token-name: light-dark(#12544a, #80e5d6);
}