{
  "color": {
    "$type": "color",
    "grayscale": {
      "L1": {
        "$value": "#fcfcfc"
      },
      "L2": {
        "$value": "#FAFAF9"
      },
      "L3": {
        "$value": "#F5F5F4"
      },
      "L4": {
        "$value": "#F1F0EF"
      },
      "L5": {
        "$value": "#E7E6E4"
      },
      "L6": {
        "$value": "#D8D6D4"
      },
      "L7": {
        "$value": "#B4B3B1"
      },
      "L8": {
        "$value": "#969390"
      },
      "L9": {
        "$value": "#706E6B"
      },
      "L10": {
        "$value": "#5C5957"
      },
      "L11": {
        "$value": "#333332"
      },
      "L12": {
        "$value": "#0D0D0C"
      },
      "L0": {
        "$value": "#ffffff"
      }
    },
    "red": {
      "L1": {
        "$value": "#FFF5F5"
      },
      "L2": {
        "$value": "#FFE5E8"
      },
      "L3": {
        "$value": "#FBD0D2"
      },
      "L4": {
        "$value": "#FA9AA0"
      },
      "L5": {
        "$value": "#F8757E"
      },
      "L6": {
        "$value": "#F2505A"
      },
      "L7": {
        "$value": "#E12D38"
      },
      "L8": {
        "$value": "#DA2B39"
      },
      "L9": {
        "$value": "#B52834"
      },
      "L10": {
        "$value": "#911F28"
      },
      "L11": {
        "$value": "#6E161D"
      },
      "L12": {
        "$value": "#240407"
      }
    },
    "green": {
      "L1": {
        "$value": "#F7FDFA"
      },
      "L2": {
        "$value": "#E7F8EE"
      },
      "L3": {
        "$value": "#C6F1D9"
      },
      "L4": {
        "$value": "#98E5BB"
      },
      "L5": {
        "$value": "#75DCA4"
      },
      "L6": {
        "$value": "#50D38D"
      },
      "L7": {
        "$value": "#2CC975"
      },
      "L8": {
        "$value": "#0C9149"
      },
      "L9": {
        "$value": "#0F6E3B"
      },
      "L10": {
        "$value": "#0B552E"
      },
      "L11": {
        "$value": "#073D21"
      },
      "L12": {
        "$value": "#042817"
      }
    },
    "yellow": {
      "L1": {
        "$value": "#FFFDF5"
      },
      "L2": {
        "$value": "#FDF9E2"
      },
      "L3": {
        "$value": "#FBF2BC"
      },
      "L4": {
        "$value": "#F7E98D"
      },
      "L5": {
        "$value": "#F5DD71"
      },
      "L6": {
        "$value": "#F4C62A"
      },
      "L7": {
        "$value": "#E5AD00"
      },
      "L8": {
        "$value": "#CF8E06"
      },
      "L9": {
        "$value": "#BC7D06"
      },
      "L10": {
        "$value": "#956303"
      },
      "L11": {
        "$value": "#402A00"
      },
      "L12": {
        "$value": "#261800"
      }
    },
    "cyan": {
      "L1": {
        "$value": "#F5F8FF"
      },
      "L2": {
        "$value": "#E5F0FF"
      },
      "L3": {
        "$value": "#C3DDFD"
      },
      "L4": {
        "$value": "#AAD0FD"
      },
      "L5": {
        "$value": "#85B9FA"
      },
      "L6": {
        "$value": "#467CFB"
      },
      "L7": {
        "$value": "#0C4DE4"
      },
      "L8": {
        "$value": "#0241D4"
      },
      "L9": {
        "$value": "#0031A3"
      },
      "L10": {
        "$value": "#002A8D"
      },
      "L11": {
        "$value": "#001D60"
      },
      "L12": {
        "$value": "#000E2F"
      }
    },
    "blue": {
      "L1": {
        "$value": "#F1FAFE"
      },
      "L2": {
        "$value": "#E3F7FF"
      },
      "L3": {
        "$value": "#CFEFFC"
      },
      "L4": {
        "$value": "#9FDFF9"
      },
      "L5": {
        "$value": "#75CAF0"
      },
      "L6": {
        "$value": "#4FB5E3"
      },
      "L7": {
        "$value": "#0D9AD8"
      },
      "L8": {
        "$value": "#0877AF"
      },
      "L9": {
        "$value": "#07649C"
      },
      "L10": {
        "$value": "#064D87"
      },
      "L11": {
        "$value": "#04325C"
      },
      "L12": {
        "$value": "#02172D"
      }
    },
    "purple": {
      "L1": {
        "$value": "#FBFAFF"
      },
      "L2": {
        "$value": "#F1E5FF"
      },
      "L3": {
        "$value": "#DFC5FF"
      },
      "L4": {
        "$value": "#D0A9FF"
      },
      "L5": {
        "$value": "#B87EFF"
      },
      "L6": {
        "$value": "#9844FF"
      },
      "L7": {
        "$value": "#740FEF"
      },
      "L8": {
        "$value": "#5100B4"
      },
      "L9": {
        "$value": "#410090"
      },
      "L10": {
        "$value": "#31006C"
      },
      "L11": {
        "$value": "#21004A"
      },
      "L12": {
        "$value": "#0E0444"
      }
    },
    "plum": {
      "L1": {
        "$value": "#FFF5FF"
      },
      "L2": {
        "$value": "#FFE5FF"
      },
      "L3": {
        "$value": "#FFC7FF"
      },
      "L4": {
        "$value": "#FFA9FF"
      },
      "L5": {
        "$value": "#FF7AFF"
      },
      "L6": {
        "$value": "#F048F0"
      },
      "L7": {
        "$value": "#EF0BEF"
      },
      "L8": {
        "$value": "#D100D1"
      },
      "L9": {
        "$value": "#BC00BC"
      },
      "L10": {
        "$value": "#7F007F"
      },
      "L11": {
        "$value": "#4A004A"
      },
      "L12": {
        "$value": "#2E002E"
      }
    },
    "peach": {
      "L1": {
        "$value": "#fff3f0"
      },
      "L2": {
        "$value": "#ffd5cc"
      },
      "L3": {
        "$value": "#ffac99"
      },
      "L9": {
        "$value": "#ff866b"
      },
      "L10": {
        "$value": "#ff5833"
      },
      "L11": {
        "$value": "#972a11"
      },
      "L12": {
        "$value": "#380a00"
      }
    },
    "sunglow": {
      "L1": {
        "$value": "#fff7e6"
      },
      "L2": {
        "$value": "#ffebc2"
      },
      "L3": {
        "$value": "#ffd470"
      },
      "L9": {
        "$value": "#ffb60a"
      },
      "L10": {
        "$value": "#8e6d1f"
      },
      "L11": {
        "$value": "#5e4713"
      },
      "L12": {
        "$value": "#382700"
      }
    },
    "teal": {
      "L1": {
        "$value": "#F1FEFC"
      },
      "L2": {
        "$value": "#E0FAF7"
      },
      "L3": {
        "$value": "#C8F9F2"
      },
      "L4": {
        "$value": "#AFF9EE"
      },
      "L5": {
        "$value": "#8CF2E4"
      },
      "L6": {
        "$value": "#4CE5D1"
      },
      "L7": {
        "$value": "#20DFC5"
      },
      "L8": {
        "$value": "#00CCB1"
      },
      "L9": {
        "$value": "#00A38D"
      },
      "L10": {
        "$value": "#00806E"
      },
      "L11": {
        "$value": "#005247"
      },
      "L12": {
        "$value": "#002924"
      }
    },
    "orange": {
      "L1": {
        "$value": "#FFFBF5"
      },
      "L2": {
        "$value": "#FFF1E5"
      },
      "L3": {
        "$value": "#FFDBB8"
      },
      "L4": {
        "$value": "#FFBB7A"
      },
      "L5": {
        "$value": "#FFA14D"
      },
      "L6": {
        "$value": "#FF8A1F"
      },
      "L7": {
        "$value": "#F97300"
      },
      "L8": {
        "$value": "#D65F00"
      },
      "L9": {
        "$value": "#A84A00"
      },
      "L10": {
        "$value": "#7A3600"
      },
      "L11": {
        "$value": "#522400"
      },
      "L12": {
        "$value": "#2E1400"
      }
    },
    "canvas": {
      "$description": "Background color for the main canvas",
      "default": {
        "$value": "{color.grayscale.L2}"
      }
    },
    "surface": {
      "$description": "Surface color for various components and states",
      "primary": {
        "highest": {
          "$value": "{color.plum.L10}"
        },
        "high": {
          "$value": "{color.plum.L8}"
        },
        "default": {
          "default": {
            "$value": "{color.plum.L6}"
          },
          "enabled": {
            "$value": "{color.plum.L6}"
          },
          "hover": {
            "$value": "{color.plum.L7}"
          },
          "pressed": {
            "$value": "{color.plum.L8}"
          },
          "focus": {
            "$value": "{color.plum.L6}"
          },
          "active": {
            "$value": "{color.plum.L6}"
          },
          "disabled": {
            "$value": "{color.grayscale.L5}"
          }
        },
        "low": {
          "$value": "{color.plum.L3}"
        },
        "lowest": {
          "default": {
            "$value": "{color.plum.L1}"
          },
          "enabled": {
            "$value": "{color.plum.L1}"
          },
          "hover": {
            "$value": "{color.grayscale.L1}"
          },
          "pressed": {
            "$value": "{color.plum.L1}"
          },
          "focus": {
            "$value": "{color.plum.L4}"
          },
          "active": {
            "$value": "{color.plum.L1}"
          },
          "disabled": {
            "$value": "{color.grayscale.L2}"
          }
        }
      },
      "neutral": {
        "default": {
          "default": {
            "$value": "{color.grayscale.L0}"
          },
          "enabled": {
            "$value": "{color.grayscale.L0}"
          },
          "hover": {
            "$value": "{color.grayscale.L3}"
          },
          "pressed": {
            "$value": "{color.plum.L2}"
          },
          "focus": {
            "$value": "{color.grayscale.L2}"
          },
          "active": {
            "$value": "{color.plum.L2}"
          },
          "selected": {
            "$value": "{color.grayscale.L3}"
          },
          "disabled": {
            "$value": "{color.grayscale.L4}"
          }
        },
        "low": {
          "default": {
            "$value": "{color.grayscale.L3}"
          },
          "enabled": {
            "$value": "{color.grayscale.L3}"
          },
          "hover": {
            "$value": "{color.grayscale.L4}"
          },
          "pressed": {
            "$value": "{color.plum.L3}"
          },
          "focus": {
            "$value": "{color.grayscale.L3}"
          },
          "active": {
            "$value": "{color.grayscale.L3}"
          },
          "disabled": {
            "$value": "{color.grayscale.L5}"
          },
          "selected": {
            "$value": "{color.grayscale.L3}"
          }
        },
        "lowest": {
          "default": {
            "$value": "{color.grayscale.L4}"
          },
          "enabled": {
            "$value": "{color.grayscale.L4}"
          },
          "hover": {
            "$value": "{color.grayscale.L5}"
          },
          "pressed": {
            "$value": "{color.grayscale.L6}"
          },
          "focus": {
            "$value": "{color.grayscale.L4}"
          },
          "active": {
            "$value": "{color.grayscale.L5}"
          },
          "disabled": {
            "$value": "{color.grayscale.L4}"
          },
          "selected": {
            "$value": "{color.grayscale.L6}"
          }
        },
        "highest": {
          "default": {
            "$value": "{color.grayscale.L12}"
          },
          "enabled": {
            "$value": "{color.grayscale.L12}"
          },
          "hover": {
            "$value": "{color.grayscale.L11}"
          },
          "pressed": {
            "$value": "{color.plum.L5}"
          },
          "active": {
            "$value": "{color.grayscale.L12}"
          },
          "focus": {
            "$value": "{color.grayscale.L12}"
          },
          "disabled": {
            "$value": "{color.grayscale.L5}"
          },
          "selected": {
            "$value": "{color.grayscale.L12}"
          }
        }
      },
      "danger": {
        "default": {
          "default": {
            "$value": "{color.red.L7}"
          },
          "enabled": {
            "$value": "{color.red.L7}"
          },
          "hover": {
            "$value": "{color.red.L8}"
          },
          "pressed": {
            "$value": "{color.red.L9}"
          },
          "focus": {
            "$value": "{color.red.L7}"
          },
          "active": {
            "$value": "{color.red.L7}"
          },
          "disabled": {
            "$value": "{color.grayscale.L8}"
          }
        },
        "low": {
          "$value": "{color.red.L3}"
        },
        "lowest": {
          "default": {
            "$value": "{color.red.L2}"
          },
          "enabled": {
            "$value": "{color.red.L1}"
          },
          "hover": {
            "$value": "{color.red.L2}"
          },
          "pressed": {
            "$value": "{color.red.L3}"
          },
          "focus": {
            "$value": "{color.grayscale.L0}"
          },
          "active": {
            "$value": "{color.red.L2}"
          },
          "disabled": {
            "$value": "{color.grayscale.L8}"
          }
        }
      },
      "warning": {
        "default": {
          "default": {
            "$value": "{color.yellow.L6}"
          },
          "enabled": {
            "$value": "{color.yellow.L6}"
          },
          "hover": {
            "$value": "{color.yellow.L7}"
          },
          "pressed": {
            "$value": "{color.yellow.L8}"
          },
          "focus": {
            "$value": "{color.yellow.L6}"
          },
          "active": {
            "$value": "{color.yellow.L6}"
          },
          "disabled": {
            "$value": "{color.grayscale.L8}"
          }
        },
        "low": {
          "$value": "{color.yellow.L3}"
        },
        "lowest": {
          "default": {
            "$value": "{color.yellow.L2}"
          },
          "enabled": {
            "$value": "{color.yellow.L2}"
          },
          "hover": {
            "$value": "{color.yellow.L2}"
          },
          "pressed": {
            "$value": "{color.yellow.L3}"
          },
          "focus": {
            "$value": "{color.grayscale.L0}"
          },
          "active": {
            "$value": "{color.yellow.L2}"
          },
          "disabled": {
            "$value": "{color.grayscale.L8}"
          }
        }
      },
      "success": {
        "default": {
          "$value": "{color.green.L8}"
        },
        "low": {
          "$value": "{color.green.L3}"
        },
        "lowest": {
          "default": {
            "$value": "{color.green.L2}"
          },
          "enabled": {
            "$value": "{color.green.L2}"
          },
          "hover": {
            "$value": "{color.green.L2}"
          },
          "pressed": {
            "$value": "{color.green.L3}"
          },
          "focus": {
            "$value": "{color.green.L4}"
          },
          "active": {
            "$value": "{color.green.L2}"
          },
          "disabled": {
            "$value": "{color.grayscale.L8}"
          }
        }
      },
      "info": {
        "default": {
          "$value": "{color.blue.L4}"
        },
        "low": {
          "$value": "{color.blue.L3}"
        },
        "lowest": {
          "default": {
            "$value": "{color.blue.L2}"
          },
          "enabled": {
            "$value": "{color.blue.L2}"
          },
          "hover": {
            "$value": "{color.blue.L3}"
          },
          "pressed": {
            "$value": "{color.blue.L3}"
          },
          "focus": {
            "$value": "{color.blue.L2}"
          },
          "active": {
            "$value": "{color.blue.L2}"
          },
          "disabled": {
            "$value": "{color.grayscale.L8}"
          }
        }
      },
      "promo": {
        "default": {
          "$value": "{color.plum.L6}"
        },
        "low": {
          "$value": "{color.plum.L3}"
        },
        "lowest": {
          "$value": "{color.plum.L2}"
        }
      },
      "ai": {
        "low": {
          "$value": "{color.purple.L6}"
        }
      },
      "form": {
        "default": {
          "enabled": {
            "$value": "{color.grayscale.L0}"
          },
          "hover": {
            "$value": "{color.grayscale.L0}"
          },
          "pressed": {
            "$value": "{color.grayscale.L0}"
          },
          "focus": {
            "$value": "{color.grayscale.L0}"
          },
          "active": {
            "$value": "{color.plum.L6}"
          },
          "selected": {
            "$value": "{color.plum.L2}"
          },
          "disabled": {
            "$value": "{color.grayscale.L3}"
          },
          "read-only": {
            "$value": "{color.grayscale.L9}"
          },
          "error": {
            "$value": "{color.red.L2}"
          }
        },
        "high": {
          "enabled": {
            "$value": "{color.grayscale.L3}"
          },
          "hover": {
            "$value": "{color.grayscale.L4}"
          },
          "pressed": {
            "$value": "{color.grayscale.L2}"
          },
          "focus": {
            "$value": "{color.grayscale.L3}"
          },
          "active": {
            "$value": "{color.grayscale.L0}"
          },
          "selected": {
            "$value": "{color.plum.L2}"
          },
          "disabled": {
            "$value": "{color.grayscale.L2}"
          },
          "read-only": {
            "$value": "{color.grayscale.L2}"
          },
          "error": {
            "$value": "{color.red.L2}"
          }
        }
      },
      "inverted": {
        "default": {
          "default": {
            "$value": "{color.grayscale.L12}"
          },
          "enabled": {
            "$value": "{color.grayscale.L12}"
          },
          "hover": {
            "$value": "{color.grayscale.L10}"
          },
          "pressed": {
            "$value": "{color.grayscale.L11}"
          },
          "focus": {
            "$value": "{color.grayscale.L12}"
          },
          "active": {
            "$value": "{color.grayscale.L11}"
          }
        },
        "low": {
          "enabled": {
            "$value": "{color.grayscale.L11}"
          },
          "hover": {
            "$value": "{color.grayscale.L10}"
          },
          "pressed": {
            "$value": "{color.grayscale.L11}"
          },
          "active": {
            "$value": "{color.grayscale.L11}"
          },
          "focus": {
            "$value": "{color.grayscale.L11}"
          },
          "disabled": {
            "$value": "{color.grayscale.L10}"
          }
        }
      },
      "decorative-teal": {
        "default": {
          "$value": "{color.teal.L6}"
        },
        "high": {
          "$value": "{color.teal.L9}"
        },
        "low": {
          "$value": "{color.teal.L3}"
        },
        "lowest": {
          "$value": "{color.teal.L2}"
        }
      },
      "decorative-purple": {
        "high": {
          "$value": "{color.purple.L9}"
        },
        "default": {
          "$value": "{color.purple.L6}"
        },
        "low": {
          "$value": "{color.purple.L3}"
        },
        "lowest": {
          "$value": "{color.purple.L2}"
        }
      },
      "decorative-plum": {
        "default": {
          "$value": "{color.plum.L6}"
        },
        "high": {
          "$value": "{color.plum.L9}"
        },
        "low": {
          "$value": "{color.plum.L3}"
        },
        "lowest": {
          "$value": "{color.plum.L2}"
        }
      },
      "decorative-orange": {
        "default": {
          "$value": "{color.orange.L6}"
        },
        "high": {
          "$value": "{color.orange.L9}"
        },
        "low": {
          "$value": "{color.orange.L3}"
        },
        "lowest": {
          "$value": "{color.orange.L2}"
        }
      }
    },
    "content": {
      "$description": "Content color.for text and icons",
      "primary": {
        "default": {
          "default": {
            "$value": "{color.plum.L6}"
          },
          "enabled": {
            "$value": "{color.plum.L8}"
          },
          "hover": {
            "$value": "{color.plum.L9}"
          },
          "pressed": {
            "$value": "{color.plum.L10}"
          },
          "focus": {
            "$value": "{color.plum.L8}"
          },
          "active": {
            "$value": "{color.plum.L8}"
          },
          "disabled": {
            "$value": "{color.grayscale.L7}"
          }
        },
        "high": {
          "$value": "{color.plum.L10}"
        }
      },
      "neutral": {
        "default": {
          "default": {
            "$value": "{color.grayscale.L12}"
          },
          "enabled": {
            "$value": "{color.grayscale.L12}"
          },
          "hover": {
            "$value": "{color.grayscale.L12}"
          },
          "pressed": {
            "$value": "{color.grayscale.L12}"
          },
          "focus": {
            "$value": "{color.grayscale.L12}"
          },
          "active": {
            "$value": "{color.grayscale.L12}"
          },
          "disabled": {
            "$value": "{color.grayscale.L7}"
          }
        },
        "low": {
          "$value": "{color.grayscale.L11}"
        },
        "lowest": {
          "default": {
            "$value": "{color.grayscale.L9}"
          },
          "enabled": {
            "$value": "{color.grayscale.L9}"
          },
          "hover": {
            "$value": "{color.grayscale.L10}"
          },
          "pressed": {
            "$value": "{color.grayscale.L12}"
          },
          "focus": {
            "$value": "{color.grayscale.L9}"
          },
          "active": {
            "$value": "{color.grayscale.L9}"
          },
          "disabled": {
            "$value": "{color.grayscale.L7}"
          }
        }
      },
      "danger": {
        "default": {
          "default": {
            "$value": "{color.red.L8}"
          },
          "enabled": {
            "$value": "{color.red.L9}"
          },
          "hover": {
            "$value": "{color.red.L10}"
          },
          "pressed": {
            "$value": "{color.red.L11}"
          },
          "focus": {
            "$value": "{color.red.L9}"
          },
          "active": {
            "$value": "{color.red.L9}"
          },
          "disabled": {
            "$value": "{color.grayscale.L8}"
          }
        },
        "high": {
          "$value": "{color.red.L10}"
        }
      },
      "warning": {
        "default": {
          "default": {
            "$value": "{color.yellow.L7}"
          },
          "enabled": {
            "$value": "{color.yellow.L11}"
          },
          "hover": {
            "$value": "{color.yellow.L11}"
          },
          "pressed": {
            "$value": "{color.yellow.L12}"
          },
          "focus": {
            "$value": "{color.yellow.L11}"
          },
          "active": {
            "$value": "{color.yellow.L11}"
          },
          "disabled": {
            "$value": "{color.grayscale.L8}"
          }
        },
        "high": {
          "$value": "{color.yellow.L11}"
        }
      },
      "success": {
        "default": {
          "default": {
            "$value": "{color.green.L8}"
          },
          "enabled": {
            "$value": "{color.green.L9}"
          },
          "hover": {
            "$value": "{color.green.L10}"
          },
          "pressed": {
            "$value": "{color.green.L11}"
          },
          "focus": {
            "$value": "{color.green.L9}"
          },
          "active": {
            "$value": "{color.green.L10}"
          },
          "disabled": {
            "$value": "{color.grayscale.L8}"
          }
        },
        "high": {
          "$value": "{color.green.L11}"
        }
      },
      "info": {
        "default": {
          "default": {
            "$value": "{color.blue.L7}"
          },
          "enabled": {
            "$value": "{color.blue.L9}"
          },
          "hover": {
            "$value": "{color.blue.L10}"
          },
          "pressed": {
            "$value": "{color.blue.L11}"
          },
          "focus": {
            "$value": "{color.blue.L9}"
          },
          "active": {
            "$value": "{color.blue.L10}"
          },
          "disabled": {
            "$value": "{color.grayscale.L8}"
          }
        },
        "high": {
          "$value": "{color.blue.L11}"
        }
      },
      "promo": {
        "default": {
          "$value": "{color.plum.L6}"
        },
        "high": {
          "$value": "{color.plum.L10}"
        }
      },
      "form": {
        "enabled": {
          "$value": "{color.grayscale.L12}"
        },
        "hover": {
          "$value": "{color.grayscale.L12}"
        },
        "pressed": {
          "$value": "{color.grayscale.L12}"
        },
        "focus": {
          "$value": "{color.grayscale.L12}"
        },
        "active": {
          "$value": "{color.grayscale.L12}"
        },
        "selected": {
          "$value": "{color.grayscale.L12}"
        },
        "disabled": {
          "$value": "{color.grayscale.L8}"
        },
        "read-only": {
          "$value": "{color.grayscale.L8}"
        },
        "invalid": {
          "$value": "{color.red.L8}"
        }
      },
      "inverted": {
        "default": {
          "$value": "{color.grayscale.L0}"
        },
        "enabled": {
          "$value": "{color.grayscale.L0}"
        },
        "hover": {
          "$value": "{color.grayscale.L0}"
        },
        "pressed": {
          "$value": "{color.grayscale.L0}"
        },
        "focus": {
          "$value": "{color.grayscale.L0}"
        },
        "active": {
          "$value": "{color.grayscale.L0}"
        },
        "disabled": {
          "$value": "{color.grayscale.L7}"
        }
      },
      "decorative-teal": {
        "default": {
          "$value": "{color.teal.L6}"
        },
        "high": {
          "$value": "{color.teal.L10}"
        }
      },
      "decorative-purple": {
        "default": {
          "$value": "{color.purple.L6}"
        },
        "high": {
          "$value": "{color.purple.L10}"
        }
      },
      "decorative-plum": {
        "default": {
          "$value": "{color.plum.L6}"
        },
        "high": {
          "$value": "{color.plum.L10}"
        }
      },
      "decorative-orange": {
        "default": {
          "$value": "{color.orange.L6}"
        },
        "high": {
          "$value": "{color.orange.L10}"
        }
      }
    },
    "border": {
      "$description": "Border color.for various components and states",
      "primary": {
        "default": {
          "default": {
            "$value": "{color.plum.L7}"
          },
          "enabled": {
            "$value": "{color.plum.L7}"
          },
          "hover": {
            "$value": "{color.plum.L8}"
          },
          "pressed": {
            "$value": "{color.plum.L9}"
          },
          "focus": {
            "$value": "{color.plum.L7}"
          },
          "active": {
            "$value": "{color.plum.L7}"
          },
          "disabled": {
            "$value": "{color.grayscale.L4}"
          }
        },
        "lowest": {
          "$value": "{color.plum.L3}"
        }
      },
      "neutral": {
        "high": {
          "default": {
            "$value": "{color.grayscale.L7}"
          },
          "enabled": {
            "$value": "{color.grayscale.L8}"
          },
          "hover": {
            "$value": "{color.grayscale.L9}"
          },
          "pressed": {
            "$value": "{color.grayscale.L10}"
          },
          "focus": {
            "$value": "{color.grayscale.L8}"
          },
          "active": {
            "$value": "{color.grayscale.L8}"
          },
          "disabled": {
            "$value": "{color.grayscale.L5}"
          }
        },
        "default": {
          "default": {
            "$value": "{color.grayscale.L5}"
          },
          "enabled": {
            "$value": "{color.grayscale.L6}"
          },
          "hover": {
            "$value": "{color.grayscale.L6}"
          },
          "active": {
            "$value": "{color.grayscale.L7}"
          },
          "pressed": {
            "$value": "{color.grayscale.L6}"
          },
          "selected": {
            "$value": "{color.grayscale.L6}"
          },
          "disabled": {
            "$value": "{color.grayscale.L5}"
          }
        },
        "low": {
          "default": {
            "$value": "{color.grayscale.L4}"
          }
        },
        "highest": {
          "default": {
            "$value": "{color.grayscale.L12}"
          },
          "enabled": {
            "$value": "{color.grayscale.L12}"
          },
          "hover": {
            "$value": "{color.grayscale.L11}"
          },
          "pressed": {
            "$value": "{color.grayscale.L12}"
          },
          "active": {
            "$value": "{color.grayscale.L12}"
          },
          "focus": {
            "$value": "{color.grayscale.L12}"
          },
          "disabled": {
            "$value": "{color.grayscale.L4}"
          }
        }
      },
      "danger": {
        "default": {
          "$value": "{color.red.L4}"
        },
        "lowest": {
          "$value": "{color.red.L2}"
        }
      },
      "warning": {
        "default": {
          "$value": "{color.yellow.L4}"
        },
        "lowest": {
          "$value": "{color.yellow.L2}"
        }
      },
      "success": {
        "default": {
          "$value": "{color.green.L8}"
        },
        "low": {
          "$value": "{color.green.L4}"
        },
        "lowest": {
          "$value": "{color.green.L2}"
        }
      },
      "info": {
        "default": {
          "$value": "{color.blue.L4}"
        },
        "lowest": {
          "$value": "{color.blue.L2}"
        }
      },
      "promo": {
        "default": {
          "$value": "{color.plum.L4}"
        },
        "lowest": {
          "$value": "{color.plum.L3}"
        }
      },
      "form": {
        "enabled": {
          "$value": "{color.grayscale.L8}"
        },
        "hover": {
          "$value": "{color.grayscale.L9}"
        },
        "pressed": {
          "$value": "{color.grayscale.L10}"
        },
        "focus": {
          "$value": "{color.grayscale.L8}"
        },
        "active": {
          "$value": "{color.grayscale.L12}"
        },
        "selected": {
          "$value": "{color.plum.L6}"
        },
        "disabled": {
          "$value": "{color.grayscale.L5}"
        },
        "read-only": {
          "$value": "{color.grayscale.L5}"
        },
        "error": {
          "$value": "{color.red.L8}"
        }
      },
      "inverted": {
        "default": {
          "default": {
            "$value": "{color.grayscale.L0}"
          },
          "enabled": {
            "$value": "{color.grayscale.L2}"
          },
          "hover": {
            "$value": "{color.grayscale.L3}"
          },
          "pressed": {
            "$value": "{color.grayscale.L4}"
          },
          "focus": {
            "$value": "{color.grayscale.L2}"
          },
          "active": {
            "$value": "{color.grayscale.L1}"
          },
          "disabled": {
            "$value": "{color.grayscale.L7}"
          }
        },
        "high": {
          "$value": "{color.grayscale.L2}"
        }
      }
    },
    "utility": {
      "$description": "Utility color.for specific purposes",
      "focus-ring": {
        "$value": "{color.blue.L7}"
      },
      "inverted-focus-ring": {
        "$value": "{color.yellow.L4}"
      },
      "backdrop": {
        "$value": "#030E1D99"
      },
      "shadow": {
        "100": {
          "$value": "#0000000f"
        },
        "200": {
          "$value": "#00000014"
        },
        "300": {
          "$value": "#00000014"
        },
        "400": {
          "$value": "#0000001a"
        },
        "500": {
          "$value": "#0000001f"
        },
        "600": {
          "$value": "#0000001f"
        }
      }
    }
  }
}