@amsterdam/design-system-tokens/dist/compact.json

All design tokens from the Amsterdam Design System. Use it to apply its visual design to your website or application.

{
  "ams": {
    "space": {
      "xs": "clamp(0.1875rem, 0.1719rem + 0.0781vw, 0.25rem)",
      "s": "clamp(0.375rem, 0.3438rem + 0.1563vw, 0.5rem)",
      "m": "clamp(0.75rem, 0.6875rem + 0.3125vw, 1rem)",
      "l": "clamp(1rem, 0.875rem + 0.625vw, 1.5rem)",
      "xl": "clamp(1.25rem, 1rem + 1.25vw, 2.25rem)",
      "2xl": "clamp(1.5rem, 1.125rem + 1.875vw, 3rem)"
    },
    "typography": {
      "body-text": {
        "font-size": "1rem",
        "small": {
          "font-size": "clamp(0.8889rem, calc(0.9141rem + -0.0253vw), 0.9091rem)"
        },
        "large": {
          "font-size": "clamp(1.1rem, calc(1.0938rem + 0.0313vw), 1.125rem)"
        },
        "x-large": {
          "font-size": "clamp(1.21rem, calc(1.1961rem + 0.0695vw), 1.2656rem)"
        }
      },
      "heading": {
        "0": {
          "font-size": "clamp(1.6105rem, calc(1.5626rem + 0.2394vw), 1.802rem)"
        },
        "1": {
          "font-size": "clamp(1.4641rem, calc(1.4297rem + 0.1721vw), 1.6018rem)"
        },
        "2": {
          "font-size": "clamp(1.331rem, calc(1.3078rem + 0.116vw), 1.4238rem)"
        },
        "3": {
          "font-size": "clamp(1.21rem, calc(1.1961rem + 0.0695vw), 1.2656rem)"
        },
        "4": {
          "font-size": "clamp(1.1rem, calc(1.0938rem + 0.0313vw), 1.125rem)"
        },
        "5": {
          "font-size": "1rem"
        },
        "6": {
          "font-size": "clamp(0.8889rem, calc(0.9141rem + -0.0253vw), 0.9091rem)"
        }
      }
    },
    "grid": {
      "padding-inline": "clamp(1.25rem, 1rem + 1.25vw, 2.25rem)"
    }
  }
}