FMS hand logoFMS

tokens.json

Token Studio Format
{
  "$schema": "https://schemas.tokens.studio/latest.json",
  "$metadata": {
    "tokenSetOrder": [
      "colors",
      "typography",
      "spacing",
      "sizing",
      "borderRadius",
      "borderWidth",
      "shadows",
      "effects",
      "semantic"
    ]
  },
  "colors": {
    "primary": {
      "100": {
        "$value": "#e3f2fd",
        "$type": "color"
      },
      "200": {
        "$value": "#bbdefb",
        "$type": "color"
      },
      "300": {
        "$value": "#90caf9",
        "$type": "color"
      },
      "400": {
        "$value": "#64b5f6",
        "$type": "color"
      },
      "500": {
        "$value": "#55a7f8",
        "$type": "color"
      },
      "600": {
        "$value": "#2196f3",
        "$type": "color"
      },
      "700": {
        "$value": "#1976d2",
        "$type": "color"
      },
      "800": {
        "$value": "#1565c0",
        "$type": "color"
      },
      "900": {
        "$value": "#0d47a1",
        "$type": "color"
      }
    },
    "secondary": {
      "100": {
        "$value": "#cfd8dc",
        "$type": "color"
      },
      "200": {
        "$value": "#b0bec5",
        "$type": "color"
      },
      "300": {
        "$value": "#90a4ae",
        "$type": "color"
      },
      "400": {
        "$value": "#78909c",
        "$type": "color"
      },
      "500": {
        "$value": "#607d8b",
        "$type": "color"
      },
      "600": {
        "$value": "#546e7a",
        "$type": "color"
      },
      "700": {
        "$value": "#455a64",
        "$type": "color"
      },
      "800": {
        "$value": "#2f3136",
        "$type": "color"
      },
      "900": {
        "$value": "#1c1e22",
        "$type": "color"
      }
    },
    "functional": {
      "green": {
        "100": {
          "$value": "#F4F9F0",
          "$type": "color"
        },
        "500": {
          "$value": "#C3F3AF",
          "$type": "color"
        },
        "900": {
          "$value": "#355728",
          "$type": "color"
        }
      },
      "yellow": {
        "100": {
          "$value": "#FFF6DF",
          "$type": "color"
        },
        "500": {
          "$value": "#FCC45C",
          "$type": "color"
        },
        "900": {
          "$value": "#70461E",
          "$type": "color"
        }
      },
      "coral": {
        "100": {
          "$value": "#FFE9E4",
          "$type": "color"
        },
        "500": {
          "$value": "#FFA489",
          "$type": "color"
        },
        "900": {
          "$value": "#6C2E22",
          "$type": "color"
        }
      },
      "purple": {
        "100": {
          "$value": "#F3EFFF",
          "$type": "color"
        },
        "500": {
          "$value": "#BBAAFA",
          "$type": "color"
        },
        "900": {
          "$value": "#362C5C",
          "$type": "color"
        }
      }
    },
    "ui": {
      "lemon": {
        "$value": "#F4E285",
        "$type": "color"
      },
      "sky": {
        "$value": "#DBEAFE",
        "$type": "color"
      }
    },
    "profile": {
      "blue": {
        "500": {
          "$value": "#55A7F8",
          "$type": "color"
        }
      },
      "pink": {
        "500": {
          "$value": "#F8A5C2",
          "$type": "color"
        }
      },
      "coral": {
        "500": {
          "$value": "#FFA489",
          "$type": "color"
        }
      },
      "orange": {
        "500": {
          "$value": "#FFB464",
          "$type": "color"
        }
      },
      "purple": {
        "500": {
          "$value": "#BBAAFA",
          "$type": "color"
        }
      },
      "green": {
        "500": {
          "$value": "#C3F3AF",
          "$type": "color"
        }
      }
    },
    "neutrals": {
      "0": {
        "$value": "#ffffff",
        "$type": "color"
      },
      "50": {
        "$value": "#FBFAF5",
        "$type": "color"
      },
      "100": {
        "$value": "#F5F4EE",
        "$type": "color"
      },
      "200": {
        "$value": "#ECEAE0",
        "$type": "color"
      },
      "300": {
        "$value": "#DDD9CC",
        "$type": "color"
      },
      "400": {
        "$value": "#C5C0B0",
        "$type": "color"
      },
      "500": {
        "$value": "#9A9585",
        "$type": "color"
      },
      "600": {
        "$value": "#6c757d",
        "$type": "color"
      },
      "700": {
        "$value": "#4a4f57",
        "$type": "color"
      },
      "800": {
        "$value": "#2f3136",
        "$type": "color"
      },
      "900": {
        "$value": "#212529",
        "$type": "color"
      }
    }
  },
  "typography": {
    "fontFamilies": {
      "primary": {
        "$value": "Igra Sans",
        "$type": "fontFamily"
      },
      "mono": {
        "$value": "Inter",
        "$type": "fontFamily"
      }
    },
    "fontWeights": {
      "regular": {
        "$value": "900",
        "$type": "fontWeight"
      },
      "code": {
        "$value": "400",
        "$type": "fontWeight"
      }
    },
    "fontSize": {
      "xs": {
        "$value": "0.75rem",
        "$type": "fontSize"
      },
      "sm": {
        "$value": "0.875rem",
        "$type": "fontSize"
      },
      "base": {
        "$value": "1rem",
        "$type": "fontSize"
      },
      "lg": {
        "$value": "1.125rem",
        "$type": "fontSize"
      },
      "xl": {
        "$value": "1.25rem",
        "$type": "fontSize"
      },
      "2xl": {
        "$value": "1.5rem",
        "$type": "fontSize"
      },
      "3xl": {
        "$value": "1.875rem",
        "$type": "fontSize"
      },
      "4xl": {
        "$value": "2.25rem",
        "$type": "fontSize"
      },
      "5xl": {
        "$value": "3rem",
        "$type": "fontSize"
      }
    },
    "lineHeights": {
      "tight": {
        "$value": "1.1",
        "$type": "lineHeight"
      },
      "normal": {
        "$value": "1.5",
        "$type": "lineHeight"
      },
      "relaxed": {
        "$value": "1.75",
        "$type": "lineHeight"
      }
    },
    "letterSpacing": {
      "tight": {
        "$value": "-0.02em",
        "$type": "letterSpacing"
      },
      "normal": {
        "$value": "0",
        "$type": "letterSpacing"
      },
      "wide": {
        "$value": "0.05em",
        "$type": "letterSpacing"
      }
    },
    "textStroke": {
      "bold": {
        "$value": "0.6px",
        "$type": "borderWidth"
      },
      "heavy": {
        "$value": "0.7px",
        "$type": "borderWidth"
      }
    }
  },
  "spacing": {
    "0": {
      "$value": "0rem",
      "$type": "spacing"
    },
    "1": {
      "$value": "0.25rem",
      "$type": "spacing"
    },
    "2": {
      "$value": "0.5rem",
      "$type": "spacing"
    },
    "3": {
      "$value": "0.75rem",
      "$type": "spacing"
    },
    "4": {
      "$value": "1rem",
      "$type": "spacing"
    },
    "5": {
      "$value": "1.25rem",
      "$type": "spacing"
    },
    "6": {
      "$value": "1.5rem",
      "$type": "spacing"
    },
    "8": {
      "$value": "2rem",
      "$type": "spacing"
    },
    "10": {
      "$value": "2.5rem",
      "$type": "spacing"
    },
    "12": {
      "$value": "3rem",
      "$type": "spacing"
    },
    "16": {
      "$value": "4rem",
      "$type": "spacing"
    }
  },
  "sizing": {
    "container": {
      "$value": "60.75rem",
      "$type": "sizing"
    },
    "card": {
      "$value": "66.5rem",
      "$type": "sizing"
    },
    "pill": {
      "$value": "2.25rem",
      "$type": "sizing"
    }
  },
  "borderRadius": {
    "sm": {
      "$value": "0.75rem",
      "$type": "borderRadius"
    },
    "md": {
      "$value": "1.3125rem",
      "$type": "borderRadius"
    },
    "lg": {
      "$value": "1.75rem",
      "$type": "borderRadius"
    }
  },
  "borderWidth": {
    "base": {
      "$value": "2px",
      "$type": "borderWidth"
    },
    "strong": {
      "$value": "4px",
      "$type": "borderWidth"
    }
  },
  "shadows": {
    "card": {
      "$value": {
        "x": "8px",
        "y": "8px",
        "blur": "0px",
        "spread": "0px",
        "color": "rgba(47,49,54,0.1)",
        "type": "dropShadow"
      },
      "$type": "boxShadow"
    }
  },
  "effects": {
    "strokeHeading": {
      "$value": "0.6px",
      "$type": "borderWidth"
    }
  },
  "semantic": {
    "background": {
      "page": {
        "$value": "{colors.neutrals.50}",
        "$type": "color"
      },
      "surface": {
        "$value": "{colors.neutrals.0}",
        "$type": "color"
      },
      "code": {
        "$value": "{colors.secondary.800}",
        "$type": "color"
      }
    },
    "text": {
      "primary": {
        "$value": "{colors.secondary.800}",
        "$type": "color"
      },
      "inverse": {
        "$value": "{colors.neutrals.0}",
        "$type": "color"
      },
      "muted": {
        "$value": "rgba(255,255,255,0.9)",
        "$type": "color"
      }
    },
    "status": {
      "success": {
        "$value": "{colors.functional.green.500}",
        "$type": "color"
      },
      "warning": {
        "$value": "{colors.functional.yellow.500}",
        "$type": "color"
      },
      "danger": {
        "$value": "{colors.functional.coral.500}",
        "$type": "color"
      },
      "info": {
        "$value": "{colors.functional.purple.500}",
        "$type": "color"
      }
    }
  }
}