{
  "id": "joi-light",
  "displayName": "Joi Light",
  "reduceTransparent": true,
  "nativeTheme": "light",
  "variables": {
    "app": {
      "bg": "0, 0%, 100%, 1",
      "transparent": "0, 0%, 100%, 0.8",
      "border": "0, 0%, 0%, 0.1",
      "link": "221, 83%, 53%, 1",
      "code-block": "0, 0%, 17%, 1"
    },

    "primary": {
      "bg": {
        "__default": "221, 83%, 53%, 1",
        "soft": "221, 83%, 53%, 0.1"
      },
      "fg": "0, 0%, 100%, 1"
    },

    "secondary": {
      "bg": " 0, 0%, 0%, 0.1",
      "fg": " 0, 0%, 0%, 1"
    },

    "tertiary": {
      "bg": "0, 0%, 0%, 0.02"
    },

    "disabled": {
      "bg": " 0, 0%, 0%, 0.05",
      "fg": " 0, 0%, 0%, 0.2"
    },

    "top-panel": {
      "bg": "0, 0%, 100%, 0.8"
    },

    "bottom-panel": {
      "bg": "0, 0%, 100%, 0.8"
    },

    "ribbon-panel": {
      "bg": "0, 0%, 100%, 0.8",
      "border": "0, 0%, 0%, 0.1",
      "icon": "0, 0%, 0%, 0.5",
      "icon-hover": "0, 0%, 0%, 0.03",
      "icon-active": "0, 0%, 0%, 1",
      "icon-active-bg": "0, 0%, 0%, 0.05"
    },

    "left-panel": {
      "bg": "0, 0%, 100%, 1",
      "menu": "0, 0%, 0%, 0.8",
      "menu-hover": "0, 0%, 0%, 0.03",
      "menu-active": "0, 0%, 0%, 1",
      "icon-active-bg": "0, 0%, 0%, 0.05"
    },

    "center-panel": {
      "bg": "0, 0%, 100%, 1"
    },

    "right-panel": {
      "bg": "0, 0%, 100%, 1"
    },

    "tooltip": {
      "bg": "0, 0%, 0%, 1",
      "fg": "0, 0%, 100%, 1"
    },

    "switch": {
      "bg": "0, 0%, 0%, 0.1",
      "fg": "0, 0%, 100%, 1"
    },

    "dropdown-menu": {
      "hover-bg": "0, 0%, 0%, 0.03"
    },

    "scrollbar": {
      "tracker": "0, 0%, 95%, 0.1",
      "thumb": "0, 0%, 0%, 0.1"
    },

    "input": {
      "bg": "0, 0%, 100%, 0",
      "placeholder": "0, 0%, 0%, 0.5",
      "icon": "0, 0%, 0%, 0.5",
      "border": "0, 0%, 0%, 0.1"
    },

    "textarea": {
      "bg": "0, 0%, 100%, 0",
      "placeholder": "0, 0%, 0%, 0.5",
      "icon": "0, 0%, 0%, 0.5",
      "border": "0, 0%, 0%, 0.1"
    },

    "select": {
      "input-bg": "0, 0%, 100%, 0",
      "bg": "0, 0%, 100%, 1",
      "placeholder": "0, 0%, 0%, 0.5",
      "icon": "0, 0%, 0%, 0.5",
      "options-active-bg": "0, 0%, 0%, 0.03",
      "border": "0, 0%, 0%, 0.1"
    },

    "progress-track": {
      "bg": "0, 0%, 0%, 0.1"
    },

    "modal": {
      "overlay": "0, 0%, 0%, 0.5",
      "bg": "0, 0%, 100%, 1",
      "fg": "0, 0%, 0%, 1"
    },

    "loader": {
      "bg": "221, 83%, 53%, 0.1",
      "fg": "221, 83%, 53%, 1",
      "active-bg": "221, 83%, 53%, 0.2"
    },

    "toaster": {
      "bg": "240, 6%, 10%, 1",
      "text-title": "0, 0%, 100%, 1",
      "close-icon": "0, 0%, 100%, 0.8",
      "text-desc": "0, 0%, 100%, 0.8"
    },

    "slider": {
      "track-bg": "0, 0%, 0%, 0.1",
      "thumb-bg": "0, 0%, 100%, 1"
    },

    "resize": {
      "bg": "0, 0%, 0%, 0.1"
    }
  }
}