@amsterdam/design-system-tokens/src/brand/ams/color.tokens.json

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

{
  "ams": {
    "color": {
      "background": { "value": "#ffffff" },
      "feedback": {
        "error": { "value": "#ec0000" },
        "info": { "value": "#009de6" },
        "success": { "value": "#00a03c" },
        "warning": { "value": "#ff9100" }
      },
      "highlight": {
        "azure": { "value": "#009de6" },
        "green": { "value": "#00a03c" },
        "lime": { "value": "#bed200" },
        "magenta": { "value": "#e50082" },
        "orange": { "value": "#ff9100" },
        "purple": { "value": "#a00078" },
        "yellow": { "value": "#ffe600" }
      },
      "interactive": {
        "contrast": { "value": "#000000" },
        "default": { "value": "#004699" },
        "disabled": { "value": "#767676" },
        "hover": { "value": "#003677" },
        "invalid": {
          "default": { "value": "#ec0000" },
          "hover": { "value": "#b70000" }
        },
        "inverse": { "value": "#ffffff" },
        "secondary": { "value": "#181818" }
      },
      "separator": { "value": "#d1d1d1" },
      "text": {
        "default": { "value": "#181818" },
        "inverse": { "value": "#ffffff" },
        "secondary": { "value": "#767676" }
      }
    }
  }
}