{
  "$description": "Lisa v0.1 design tokens in the Design Tokens Community Group (DTCG) format. lisa.css exposes the same tokens as CSS custom properties with the same names (--bg, --fill-1, --space-3...). When one changes, change both.",
  "color": {
    "$type": "color",
    "$description": "$value is the Day value; the Dusk value is under $extensions[\"com.lisa.mode\"].dusk. Fills are never text by Day.",
    "bg": {
      "$value": {
        "colorSpace": "srgb",
        "components": [
          1.0,
          1.0,
          1.0
        ],
        "hex": "#ffffff"
      },
      "$description": "Page ground. Paper by Day, Midnight by Dusk.",
      "$extensions": {
        "com.lisa.mode": {
          "dusk": "#160b2b"
        }
      }
    },
    "surface": {
      "$value": {
        "colorSpace": "srgb",
        "components": [
          0.9647,
          0.9451,
          1.0
        ],
        "hex": "#f6f1ff"
      },
      "$description": "Cards, wells, table heads.",
      "$extensions": {
        "com.lisa.mode": {
          "dusk": "#24123f"
        }
      }
    },
    "text": {
      "$value": {
        "colorSpace": "srgb",
        "components": [
          0.0784,
          0.0,
          0.1216
        ],
        "hex": "#14001f"
      },
      "$description": "Body text. Ink by Day, Starlight by Dusk.",
      "$extensions": {
        "com.lisa.mode": {
          "dusk": "#f6eeff"
        }
      }
    },
    "text-muted": {
      "$value": {
        "colorSpace": "srgb",
        "components": [
          0.3569,
          0.2902,
          0.4
        ],
        "hex": "#5b4a66"
      },
      "$description": "Secondary text and metadata.",
      "$extensions": {
        "com.lisa.mode": {
          "dusk": "#b9a6d6"
        }
      }
    },
    "border": {
      "$value": {
        "colorSpace": "srgb",
        "components": [
          0.0784,
          0.0,
          0.1216
        ],
        "hex": "#14001f"
      },
      "$description": "Every edge, at 3px.",
      "$extensions": {
        "com.lisa.mode": {
          "dusk": "#b9a6d6"
        }
      }
    },
    "accent-text": {
      "$value": {
        "colorSpace": "srgb",
        "components": [
          0.7098,
          0.0,
          0.4157
        ],
        "hex": "#b5006a"
      },
      "$description": "Links. The only coloured text.",
      "$extensions": {
        "com.lisa.mode": {
          "dusk": "#ff4fd8"
        }
      }
    },
    "on-fill": {
      "$value": {
        "colorSpace": "srgb",
        "components": [
          0.0784,
          0.0,
          0.1216
        ],
        "hex": "#14001f"
      },
      "$description": "Text on any fill.",
      "$extensions": {
        "com.lisa.mode": {
          "dusk": "#160b2b"
        }
      }
    },
    "on-fill-6": {
      "$value": {
        "colorSpace": "srgb",
        "components": [
          1.0,
          1.0,
          1.0
        ],
        "hex": "#ffffff"
      },
      "$description": "Text on fill-6 (violet). Ink fails by Day (3.7:1).",
      "$extensions": {
        "com.lisa.mode": {
          "dusk": "#160b2b"
        }
      }
    },
    "ring": {
      "$value": {
        "colorSpace": "srgb",
        "components": [
          0.5412,
          0.1686,
          1.0
        ],
        "hex": "#8a2bff"
      },
      "$description": "Focus ring.",
      "$extensions": {
        "com.lisa.mode": {
          "dusk": "#f6eeff"
        }
      }
    },
    "fill-1": {
      "$value": {
        "colorSpace": "srgb",
        "components": [
          1.0,
          0.1765,
          0.6275
        ],
        "hex": "#ff2da0"
      },
      "$description": "Magenta / Flamingo. Primary action, errors, hearts.",
      "$extensions": {
        "com.lisa.mode": {
          "dusk": "#ff4fd8"
        }
      }
    },
    "fill-2": {
      "$value": {
        "colorSpace": "srgb",
        "components": [
          1.0,
          0.5412,
          0.0
        ],
        "hex": "#ff8a00"
      },
      "$description": "Tangerine / Sunset. Badges, warnings.",
      "$extensions": {
        "com.lisa.mode": {
          "dusk": "#ff9f45"
        }
      }
    },
    "fill-3": {
      "$value": {
        "colorSpace": "srgb",
        "components": [
          1.0,
          0.902,
          0.0
        ],
        "hex": "#ffe600"
      },
      "$description": "Lemon. Notices, highlights, stars.",
      "$extensions": {
        "com.lisa.mode": {
          "dusk": "#ffe600"
        }
      }
    },
    "fill-4": {
      "$value": {
        "colorSpace": "srgb",
        "components": [
          0.2235,
          0.902,
          0.102
        ],
        "hex": "#39e61a"
      },
      "$description": "Lime. Success.",
      "$extensions": {
        "com.lisa.mode": {
          "dusk": "#39e61a"
        }
      }
    },
    "fill-5": {
      "$value": {
        "colorSpace": "srgb",
        "components": [
          0.0,
          0.8314,
          1.0
        ],
        "hex": "#00d4ff"
      },
      "$description": "Cyan / Lagoon. Selection, info.",
      "$extensions": {
        "com.lisa.mode": {
          "dusk": "#3de8ff"
        }
      }
    },
    "fill-6": {
      "$value": {
        "colorSpace": "srgb",
        "components": [
          0.5412,
          0.1686,
          1.0
        ],
        "hex": "#8a2bff"
      },
      "$description": "Violet / Ultraviolet. Decoration only.",
      "$extensions": {
        "com.lisa.mode": {
          "dusk": "#9b5cff"
        }
      }
    },
    "code-bg": {
      "$value": {
        "colorSpace": "srgb",
        "components": [
          0.0784,
          0.0,
          0.1216
        ],
        "hex": "#14001f"
      },
      "$description": "Code wells.",
      "$extensions": {
        "com.lisa.mode": {
          "dusk": "#0e061d"
        }
      }
    },
    "code-text": {
      "$value": {
        "colorSpace": "srgb",
        "components": [
          1.0,
          0.902,
          0.0
        ],
        "hex": "#ffe600"
      },
      "$description": "Code text.",
      "$extensions": {
        "com.lisa.mode": {
          "dusk": "#ffe600"
        }
      }
    }
  },
  "font": {
    "$type": "fontFamily",
    "display": {
      "$value": [
        "Bungee",
        "Arial Black",
        "sans-serif"
      ],
      "$description": "Headings. Capitals, 24px and up."
    },
    "body": {
      "$value": [
        "Nunito",
        "system-ui",
        "sans-serif"
      ],
      "$description": "Body and UI. 400/700/900."
    },
    "mono": {
      "$value": [
        "Space Mono",
        "ui-monospace",
        "monospace"
      ],
      "$description": "Labels, tokens, code. 12px caps, +0.08em."
    }
  },
  "text": {
    "$type": "dimension",
    "label": {
      "$value": {
        "value": 12,
        "unit": "px"
      }
    },
    "sm": {
      "$value": {
        "value": 15,
        "unit": "px"
      }
    },
    "body": {
      "$value": {
        "value": 17,
        "unit": "px"
      }
    },
    "h3": {
      "$value": {
        "value": 22,
        "unit": "px"
      }
    },
    "h2": {
      "$value": {
        "value": 30,
        "unit": "px"
      }
    },
    "h1": {
      "$value": {
        "value": 48,
        "unit": "px"
      }
    },
    "display": {
      "$value": {
        "value": 88,
        "unit": "px"
      }
    }
  },
  "space": {
    "$type": "dimension",
    "$description": "4px base. Nothing in between.",
    "1": {
      "$value": {
        "value": 4,
        "unit": "px"
      }
    },
    "2": {
      "$value": {
        "value": 8,
        "unit": "px"
      }
    },
    "3": {
      "$value": {
        "value": 12,
        "unit": "px"
      }
    },
    "4": {
      "$value": {
        "value": 16,
        "unit": "px"
      }
    },
    "5": {
      "$value": {
        "value": 24,
        "unit": "px"
      }
    },
    "6": {
      "$value": {
        "value": 32,
        "unit": "px"
      }
    },
    "7": {
      "$value": {
        "value": 48,
        "unit": "px"
      }
    },
    "8": {
      "$value": {
        "value": 64,
        "unit": "px"
      }
    }
  },
  "radius": {
    "$type": "dimension",
    "sm": {
      "$value": {
        "value": 10,
        "unit": "px"
      },
      "$description": "Inputs."
    },
    "default": {
      "$value": {
        "value": 14,
        "unit": "px"
      },
      "$description": "Cards, alerts, swatches."
    },
    "pill": {
      "$value": {
        "value": 999,
        "unit": "px"
      },
      "$description": "Buttons and chips."
    }
  },
  "rule": {
    "$type": "dimension",
    "default": {
      "$value": {
        "value": 3,
        "unit": "px"
      },
      "$description": "Every edge."
    },
    "heavy": {
      "$value": {
        "value": 6,
        "unit": "px"
      },
      "$description": "Blockquotes, print slab."
    },
    "slab": {
      "$value": {
        "value": 16,
        "unit": "px"
      },
      "$description": "Spectrum slab, top and bottom of a page."
    }
  },
  "depth": {
    "$type": "shadow",
    "$description": "Day: hard ink offset. Dusk: glow in fill-1. The only token that changes shape between modes.",
    "default": {
      "$value": {
        "color": "#14001F",
        "offsetX": {
          "value": 6,
          "unit": "px"
        },
        "offsetY": {
          "value": 6,
          "unit": "px"
        },
        "blur": {
          "value": 0,
          "unit": "px"
        },
        "spread": {
          "value": 0,
          "unit": "px"
        }
      },
      "$extensions": {
        "com.lisa.mode": {
          "dusk": {
            "color": "#FF4FD88C",
            "offsetX": {
              "value": 0,
              "unit": "px"
            },
            "offsetY": {
              "value": 0,
              "unit": "px"
            },
            "blur": {
              "value": 28,
              "unit": "px"
            },
            "spread": {
              "value": 0,
              "unit": "px"
            }
          }
        }
      }
    },
    "sm": {
      "$value": {
        "color": "#14001F",
        "offsetX": {
          "value": 4,
          "unit": "px"
        },
        "offsetY": {
          "value": 4,
          "unit": "px"
        },
        "blur": {
          "value": 0,
          "unit": "px"
        },
        "spread": {
          "value": 0,
          "unit": "px"
        }
      },
      "$extensions": {
        "com.lisa.mode": {
          "dusk": {
            "color": "#FF4FD873",
            "offsetX": {
              "value": 0,
              "unit": "px"
            },
            "offsetY": {
              "value": 0,
              "unit": "px"
            },
            "blur": {
              "value": 18,
              "unit": "px"
            },
            "spread": {
              "value": 0,
              "unit": "px"
            }
          }
        }
      }
    }
  },
  "motion": {
    "tilt": {
      "$type": "number",
      "$value": -6,
      "$description": "Degrees. One tilted thing per view."
    },
    "press": {
      "$value": {
        "value": 3,
        "unit": "px"
      },
      "$description": "Pressed controls shift this far."
    },
    "duration": {
      "$type": "duration",
      "$value": {
        "value": 120,
        "unit": "ms"
      }
    }
  }
}