@visual-framework/vf-design-tokens/src/maps/vf-color__text.yml

A collection of design tokens for consumption across projects and products

# ------------
# Text Colours
# ------------

imports:
  - "../theme.palette.alias.yml"

props:

  # Primary Text Colours
  # --------------------
  - name: vf-color__text--primary
    value: '{!vf-color__text--primary}'
    meta:
      friendlyName: Primary Text Colour
      sassFunction: text-color
      sassMap: primary
      sassVariable: vf-color__text--primary
      CSSCustomProperty: -vf-color__text--primary
      comment:

  # Secondary Text Colours
  # ----------------------
  - name: vf-color__text--secondary
    value: '{!vf-color__text--secondary}'
    meta:
      friendlyName: Secondary Text Colour
      sassFunction: text-color
      sassMap: secondary
      sassVariable: vf-color__text--secondary
      CSSCustomProperty: -vf-color__text--secondary
      comment:


  # Interactive Text Colours
  # ------------------------

  # Primary Interactive Text Colours
  # --------------------------------
  - name: vf-color__link
    value: '{!vf-color__link}'
    meta:
      friendlyName: Link Colour
      sassFunction: text-color
      sassMap: default
      sassVariable: vf-color__link
      CSSCustomProperty: --vf-color__link
      comment:
  - name: vf-color__link--hover
    value: '{!vf-color__link--hover}'
    meta:
      friendlyName: Link Hover Colour
      sassFunction: text-color
      sassMap: hover
      sassVariable: vf-color__link--hover
      CSSCustomProperty: --vf-color__link--hover
      comment:
  - name: vf-color__link--focus
    value: '{!vf-color__link--focus}'
    meta:
      friendlyName: Link Focus Colour
      sassFunction: text-color
      sassMap: focus
      sassVariable: vf-color__link--focus
      CSSCustomProperty: --vf-color__link--focus
      comment:
  - name: vf-color__link--visited
    value: '{!vf-color__link--visited}'
    meta:
      friendlyName: Link Visited Colour
      sassFunction: text-color
      sassMap: visited
      sassVariable: vf-color__link--visited
      CSSCustomProperty: --vf-color__link--visited
      comment:

global:
  type: color
  category: color