@synergy-design-system/tokens/src/figma-tokens/globals.json

Design tokens for Synergy, the SICK Design System

{
  "font-size": {
    "x-small": {
      "value": "12px",
      "type": "fontSizes"
    },
    "small": {
      "value": "14px",
      "type": "fontSizes"
    },
    "medium": {
      "value": "16px",
      "type": "fontSizes"
    },
    "large": {
      "value": "20px",
      "type": "fontSizes"
    },
    "x-large": {
      "value": "24px",
      "type": "fontSizes"
    },
    "2x-large": {
      "value": "32px",
      "type": "fontSizes"
    },
    "3x-large": {
      "value": "40px",
      "type": "fontSizes"
    }
  },
  "duration": {
    "extra-fast": {
      "value": "90ms",
      "type": "duration"
    },
    "fast": {
      "value": "150ms",
      "type": "duration"
    },
    "normal": {
      "value": "250ms",
      "type": "duration"
    },
    "slow": {
      "value": "350ms",
      "type": "duration"
    },
    "extra-slow": {
      "value": "500ms",
      "type": "duration"
    }
  },
  "line-height": {
    "denser": {
      "value": "100%",
      "type": "lineHeights"
    },
    "dense": {
      "value": "120%",
      "type": "lineHeights"
    },
    "normal": {
      "value": "140%",
      "type": "lineHeights"
    },
    "loose": {
      "value": "180%",
      "type": "lineHeights"
    },
    "looser": {
      "value": "220%",
      "type": "lineHeights"
    }
  },
  "font-weight": {
    "normal": {
      "value": "400",
      "type": "fontWeights"
    },
    "semibold": {
      "value": "600",
      "type": "fontWeights"
    },
    "bold": {
      "value": "700",
      "type": "fontWeights"
    }
  },
  "shadow": {
    "medium": {
      "value": [
        {
          "x": "0",
          "y": "1",
          "blur": "2",
          "spread": "0",
          "color": "rgba( {neutral.950} , 0.08)",
          "type": "dropShadow"
        },
        {
          "x": "0",
          "y": "1",
          "blur": "4",
          "spread": "0",
          "color": "rgba( {neutral.950} , 0.08)",
          "type": "dropShadow"
        },
        {
          "x": "0",
          "y": "2",
          "blur": "8",
          "spread": "0",
          "color": "rgba( {neutral.950}, 0.08)",
          "type": "dropShadow"
        }
      ],
      "type": "boxShadow"
    },
    "large": {
      "value": [
        {
          "x": "0",
          "y": "0",
          "blur": "3",
          "spread": "0",
          "color": "rgba( {neutral.950}, 0.12)",
          "type": "dropShadow"
        },
        {
          "x": "0",
          "y": "2",
          "blur": "6",
          "spread": "0",
          "color": "rgba( {neutral.950}, 0.12)",
          "type": "dropShadow"
        },
        {
          "x": "0",
          "y": "3",
          "blur": "8",
          "spread": "0",
          "color": "rgba( {neutral.950}, 0.16)",
          "type": "dropShadow"
        }
      ],
      "type": "boxShadow"
    },
    "x-large": {
      "value": [
        {
          "x": "0",
          "y": "1",
          "blur": "4",
          "spread": "0",
          "color": "rgba( {neutral.950}, 0.12)",
          "type": "dropShadow"
        },
        {
          "x": "0",
          "y": "8",
          "blur": "24",
          "spread": "0",
          "color": "rgba( {neutral.950}, 0.12)",
          "type": "dropShadow"
        },
        {
          "x": "0",
          "y": "16",
          "blur": "48",
          "spread": "0",
          "color": "rgba( {neutral.950}, 0.16)",
          "type": "dropShadow"
        }
      ],
      "type": "boxShadow"
    },
    "overflow-down": {
      "value": [
        {
          "x": "0",
          "y": "1",
          "blur": "4",
          "spread": "0",
          "color": "rgba( {neutral.950}, 0.12)",
          "type": "dropShadow"
        },
        {
          "x": "0",
          "y": "3",
          "blur": "8",
          "spread": "0",
          "color": "rgba( {neutral.950}, 0.12)",
          "type": "dropShadow"
        },
        {
          "x": "0",
          "y": "4",
          "blur": "12",
          "spread": "0",
          "color": "rgba( {neutral.950}, 0.16)",
          "type": "dropShadow"
        }
      ],
      "type": "boxShadow",
      "description": "Overflow Down"
    },
    "overflow-up": {
      "value": [
        {
          "x": "0",
          "y": "-1",
          "blur": "4",
          "spread": "0",
          "color": "rgba( {neutral.950}, 0.12)",
          "type": "dropShadow"
        },
        {
          "x": "0",
          "y": "-3",
          "blur": "8",
          "spread": "0",
          "color": "rgba( {neutral.950}, 0.12)",
          "type": "dropShadow"
        },
        {
          "x": "0",
          "y": "-4",
          "blur": "12",
          "spread": "0",
          "color": "rgba( {neutral.950}, 0.16)",
          "type": "dropShadow"
        }
      ],
      "type": "boxShadow",
      "description": "Overflow Up"
    },
    "overflow-left": {
      "value": [
        {
          "x": "-1",
          "y": "0",
          "blur": "4",
          "spread": "0",
          "color": "rgba( {neutral.950}, 0.12)",
          "type": "dropShadow"
        },
        {
          "x": "-3",
          "y": "0",
          "blur": "8",
          "spread": "0",
          "color": "rgba( {neutral.950}, 0.12)",
          "type": "dropShadow"
        },
        {
          "x": "-4",
          "y": "0",
          "blur": "12",
          "spread": "0",
          "color": "rgba( {neutral.950}, 0.16)",
          "type": "dropShadow"
        }
      ],
      "type": "boxShadow",
      "description": "Overflow Left"
    },
    "overflow-right": {
      "value": [
        {
          "x": "1",
          "y": "0",
          "blur": "4",
          "spread": "0",
          "color": "rgba( {neutral.950}, 0.12)",
          "type": "dropShadow"
        },
        {
          "x": "3",
          "y": "0",
          "blur": "8",
          "spread": "0",
          "color": "rgba( {neutral.950}, 0.12)",
          "type": "dropShadow"
        },
        {
          "x": "4",
          "y": "0",
          "blur": "12",
          "spread": "0",
          "color": "rgba( {neutral.950}, 0.16)",
          "type": "dropShadow"
        }
      ],
      "type": "boxShadow",
      "description": "Overflow Right"
    }
  },
  "font": {
    "sans": {
      "value": "Open Sans",
      "type": "fontFamilies",
      "description": "Open Sans"
    },
    "mono": {
      "value": "Roboto Mono",
      "type": "fontFamilies"
    }
  },
  "spacing": {
    "4x-small": {
      "value": "{dimension.base}/4",
      "type": "spacing"
    },
    "3x-small": {
      "value": "{dimension.base}/2",
      "type": "spacing"
    },
    "2x-small": {
      "value": "{dimension.base}*1",
      "type": "spacing"
    },
    "x-small": {
      "value": "{dimension.base}*2",
      "type": "spacing"
    },
    "small": {
      "value": "{dimension.base}*3",
      "type": "spacing"
    },
    "medium": {
      "value": "{dimension.base}*4",
      "type": "spacing"
    },
    "medium-large": {
      "value": "{dimension.base}*5",
      "type": "spacing"
    },
    "large": {
      "value": "{dimension.base}*6",
      "type": "spacing"
    },
    "x-large": {
      "value": "{dimension.base}*8",
      "type": "spacing"
    },
    "2x-large": {
      "value": "{dimension.base}*12",
      "type": "spacing"
    },
    "3x-large": {
      "value": "{dimension.base}*16",
      "type": "spacing"
    },
    "4x-large": {
      "value": "{dimension.base}*24",
      "type": "spacing"
    },
    "5x-large": {
      "value": "{dimension.base}*32",
      "type": "spacing"
    }
  },
  "border-radius": {
    "none": {
      "value": "0px",
      "type": "borderRadius"
    },
    "pill": {
      "value": "9999px",
      "type": "borderRadius"
    },
    "circle": {
      "value": "9999px",
      "type": "borderRadius"
    },
    "small": {
      "value": "4px",
      "type": "borderRadius"
    },
    "medium": {
      "value": "8px",
      "type": "borderRadius"
    }
  },
  "dimension": {
    "base": {
      "value": "4px",
      "type": "dimension"
    }
  },
  "border-width": {
    "none": {
      "value": "0px",
      "type": "borderWidth",
      "description": "None"
    },
    "small": {
      "value": "1px",
      "type": "borderWidth",
      "description": "Small"
    },
    "medium": {
      "value": "2px",
      "type": "borderWidth",
      "description": "Medium"
    },
    "large": {
      "value": "3px",
      "type": "borderWidth",
      "description": "Large"
    },
    "x-large": {
      "value": "4px",
      "type": "borderWidth",
      "description": "X Large"
    }
  },
  "font-sans-fallback": {
    "value": "-apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", sans-serif",
    "type": "other"
  },
  "opacity": {
    "50": {
      "value": "0.5",
      "type": "opacity",
      "description": "50%"
    }
  },
  "text-decoration": {
    "default": {
      "value": "none",
      "type": "textDecoration"
    },
    "underline": {
      "value": "underline",
      "type": "textDecoration"
    }
  }
}