style-dictionary/examples/basic/tokens/text.json

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

{
  "text": {
    "fonts": {
      "$type": "fontFamily",
      "serif": {
        "$value": "Times New Roman, serif"
      },
      "sans": {
        "$value": "Open Sans, sans-serif"
      }
    },
    "sizes": {
      "$type": "fontSize",
      "heading": {
        "$value": "{dimensions.7}"
      },
      "body": {
        "$value": "{dimensions.4}"
      }
    },
    "weights": {
      "$type": "fontWeight",
      "light": {
        "$value": "thin"
      },
      "regular": {
        "$value": "regular"
      },
      "bold": {
        "$value": "extra-bold"
      }
    },
    "lineHeights": {
      "$type": "number",
      "normal": {
        "$value": 1.2
      },
      "large": {
        "$value": 1.8
      }
    },
    "typography": {
      "$type": "typography",
      "heading": {
        "$value": {
          "fontFamily": "{text.fonts.sans}",
          "fontWeight": "{text.weights.bold}",
          "fontSize": "{text.sizes.heading}",
          "lineHeight": "{text.lineHeights.large}"
        }
      },
      "body": {
        "$value": {
          "fontFamily": "{text.fonts.serif}",
          "fontWeight": "{text.weights.regular}",
          "fontSize": "{text.sizes.body}",
          "lineHeight": "{text.lineHeights.normal}"
        }
      }
    }
  }
}