{
  "utrecht": {
    "button": {
      "background-color": {
        "value": "{haarlem.color.white}"
      },
      "border-color": {
        "value": "{haarlem.color.black}"
      },
      "border-radius": {},
      "border-width": {
        "value": "4px"
      },
      "color": {
        "value": "{haarlem.color.black}"
      },
      "font-family": {},
      "font-size": {
        "value": "{hlzv.typography.scale.24}"
      },
      "font-weight": {
        "value": "{hlzv.typography.common.font-weight.700}"
      },
      "inline-size": {},
      "letter-spacing": {
        "value": "-0.3px"
      },
      "line-height": {
        "value": "28px"
      },
      "margin-block-start": {
        "value": "{haarlem.space.150}"
      },
      "margin-block-end": {
        "value": "{haarlem.space.150}"
      },
      "margin-inline-start": {},
      "margin-inline-end": {},
      "min-block-size": {},
      "min-inline-size": {},
      "padding-block-start": {
        "value": "{haarlem.space.75}"
      },
      "padding-block-end": {
        "value": "{haarlem.space.75}"
      },
      "padding-inline-start": {
        "value": "{haarlem.space.133}"
      },
      "padding-inline-end": {
        "value": "{haarlem.space.133}"
      },
      "text-transform": {},
      "active": {
        "background-color": {},
        "border-color": {},
        "color": {}
      },
      "icon": {
        "gap": {
          "value": "12px"
        },
        "size": {
          "value": "24px"
        }
      },
      "disabled": {
        "background-color": {},
        "border-color": {
          "value": "#9E9FA0"
        },
        "color": {
          "value": "#9E9FA0"
        }
      },
      "focus": {
        "background-color": {
          "value": "{haarlem.color.zand.100}"
        },
        "border-color": {},
        "color": {},
        "transform-scale": {}
      },
      "hover": {
        "background-color": {
          "value": "{haarlem.color.indigo.50}"
        },
        "border-color": {},
        "color": {}
      },
      "primary-action": {
        "background-color": {},
        "border-color": {},
        "border-width": {},
        "color": {},
        "font-weight": {},
        "active": {
          "background-color": {},
          "border-color": {},
          "color": {}
        },
        "disabled": {
          "background-color": {},
          "border-color": {},
          "color": {}
        },
        "hover": {
          "background-color": {},
          "border-color": {},
          "color": {}
        },
        "focus": {
          "background-color": {},
          "border-color": {},
          "color": {}
        }
      },
      "secondary-action": {
        "background-color": {},
        "border-color": {},
        "border-width": {},
        "color": {},
        "font-weight": {},
        "active": {
          "background-color": {},
          "border-color": {},
          "color": {}
        },
        "disabled": {
          "background-color": {},
          "border-color": {},
          "color": {}
        },
        "hover": {
          "background-color": {},
          "border-color": {},
          "color": {}
        },
        "focus": {
          "background-color": {},
          "border-color": {},
          "color": {}
        }
      },
      "subtle": {
        "background-color": { "value": "transparent" },
        "border-width": { "value": "0" },
        "color": {},
        "hover": {},
        "disabled": {
          "background-color": { "value": "transparent" },
          "color": { "value": "{haarlem.color.dark-mode.25}" }
        },
        "danger": {
          "color": {},
          "hover": {
            "color": {}
          },
          "focus": {
            "color": {}
          }
        },
        "ready": {
          "color": {},
          "hover": {
            "color": {}
          },
          "focus": {
            "color": {}
          }
        }
      }
    }
  }
}