style-dictionary/examples/complete/tokens/color/brand.json

Style once, use everywhere. A build system for creating cross-platform styles.

{
  "color": {
    "brand": {
      "primary": {
        "lighter": { "value": "{color.base.teal.100.value}", "type": "color" },
        "light": { "value": "{color.base.teal.300.value}", "type": "color" },
        "base": { "value": "{color.base.teal.500.value}", "type": "color" },
        "dark": { "value": "{color.base.teal.700.value}", "type": "color" },
        "darker": { "value": "{color.base.teal.900.value}", "type": "color" }
      },

      "secondary": {
        "lighter": { "value": "{color.base.indigo.100.value}", "type": "color" },
        "light": { "value": "{color.base.indigo.300.value}", "type": "color" },
        "base": { "value": "{color.base.indigo.500.value}", "type": "color" },
        "dark": { "value": "{color.base.indigo.700.value}", "type": "color" },
        "darker": { "value": "{color.base.indigo.900.value}", "type": "color" }
      }
    }
  }
}