@visual-framework/vf-design-tokens/dist/json/vf-color__buttons.ios.json

A collection of design tokens for consumption across projects and products

{
  "properties": [
    {
      "type": "color",
      "category": "color",
      "name": "vfColorButtonTextPrimary",
      "value": "#ffffff",
      "meta": {
        "friendlyName": "Primary Button Text Colour",
        "sassFunction": "button-color",
        "sassMap": "text--primary",
        "sassVariable": "vf-color__button__text--primary",
        "CSSCustomProperty": "--vf-color__button__text--primary",
        "comment": null
      }
    },
    {
      "type": "color",
      "category": "color",
      "name": "vfColorButtonBorderPrimary",
      "value": "#3b6fb6",
      "meta": {
        "friendlyName": "Primary Button Border Colour",
        "sassFunction": "button-color",
        "sassMap": "border--primary",
        "sassVariable": "vf-color__button__border--primary",
        "CSSCustomProperty": "--vf-color__button__border--primary",
        "comment": null
      }
    },
    {
      "type": "color",
      "category": "color",
      "name": "vfColorButtonBackgroundPrimary",
      "value": "#3b6fb6",
      "meta": {
        "friendlyName": "Primary Button Background Colour",
        "sassFunction": "button-color",
        "sassMap": "background--primary",
        "sassVariable": "vf-color__button__background--primary",
        "CSSCustomProperty": "--vf-color__button__background--primary",
        "comment": null
      }
    },
    {
      "type": "color",
      "category": "color",
      "name": "vfColorButtonShadowPrimary",
      "value": "#193f90",
      "meta": {
        "friendlyName": "Primary Button Shadow Colour",
        "sassFunction": "button-color",
        "sassMap": "shadow--primary",
        "sassVariable": "vf-color__button__shadow--primary",
        "CSSCustomProperty": "--vf-color__button__shadow--primary",
        "comment": null
      }
    },
    {
      "type": "color",
      "category": "color",
      "name": "vfColorButtonTextSecondary",
      "value": "#3b6fb6",
      "meta": {
        "friendlyName": "Secondary Button Text Colour",
        "sassFunction": "button-color",
        "sassMap": "text--secondary",
        "sassVariable": "vf-color__button__text--secondary",
        "CSSCustomProperty": "--vf-color__button__text--secondary",
        "comment": null
      }
    },
    {
      "type": "color",
      "category": "color",
      "name": "vfColorButtonBorderSecondary",
      "value": "#3b6fb6",
      "meta": {
        "friendlyName": "Secondary Button Border Colour",
        "sassFunction": "button-color",
        "sassMap": "border--secondary",
        "sassVariable": "vf-color__button__border--secondary",
        "CSSCustomProperty": "--vf-color__button__border--secondary",
        "comment": null
      }
    },
    {
      "type": "color",
      "category": "color",
      "name": "vfColorButtonBackgroundSecondary",
      "value": "#ffffff",
      "meta": {
        "friendlyName": "Secondary Button Background Colour",
        "sassFunction": "button-color",
        "sassMap": "background--secondary",
        "sassVariable": "vf-color__button__background--secondary",
        "CSSCustomProperty": "--vf-color__button__background--secondary",
        "comment": null
      }
    },
    {
      "type": "color",
      "category": "color",
      "name": "vfColorButtonShadowSecondary",
      "value": "#193f90",
      "meta": {
        "friendlyName": "Secondary Button Shadow Colour",
        "sassFunction": "button-color",
        "sassMap": "shadow--secondary",
        "sassVariable": "vf-color__button__shadow--secondary",
        "CSSCustomProperty": "--vf-color__button__shadow--secondary",
        "comment": null
      }
    },
    {
      "type": "color",
      "category": "color",
      "name": "vfColorButtonTextTertiary",
      "value": "#ffffff",
      "meta": {
        "friendlyName": "Tertiary Button Text Colour",
        "sassFunction": "button-color",
        "sassMap": "text--tertiary",
        "sassVariable": "vf-color__button__text--tertiary",
        "CSSCustomProperty": "--vf-color__button__text--tertiary",
        "comment": null
      }
    },
    {
      "type": "color",
      "category": "color",
      "name": "vfColorButtonBorderTertiary",
      "value": "#373a36",
      "meta": {
        "friendlyName": "Tertiary Button Border Colour",
        "sassFunction": "button-color",
        "sassMap": "border--tertiary",
        "sassVariable": "vf-color__button__border--tertiary",
        "CSSCustomProperty": "--vf-color__button__border--tertiary",
        "comment": null
      }
    },
    {
      "type": "color",
      "category": "color",
      "name": "vfColorButtonBackgroundTertiary",
      "value": "#373a36",
      "meta": {
        "friendlyName": "Tertiary Button Background Colour",
        "sassFunction": "button-color",
        "sassMap": "background--tertiary",
        "sassVariable": "vf-color__button__background--tertiary",
        "CSSCustomProperty": "--vf-color__button__background--tertiary",
        "comment": null
      }
    },
    {
      "type": "color",
      "category": "color",
      "name": "vfColorButtonShadowTertiary",
      "value": "#000000",
      "meta": {
        "friendlyName": "Tertiary Button Shadow Colour",
        "sassFunction": "button-color",
        "sassMap": "shadow--tertiary",
        "sassVariable": "vf-color__button__shadow--tertiary",
        "CSSCustomProperty": "--vf-color__button__shadow--tertiary",
        "comment": null
      }
    }
  ]
}