{
  "$description": "Lilac Trellis — generated by UIX from preset lilac-trellis@1.1.0",
  "color": {
    "brand": {
      "50": {
        "$type": "color",
        "$value": {
          "colorSpace": "srgb",
          "components": [
            0.9608,
            0.9569,
            1
          ],
          "hex": "#f5f4ff"
        }
      },
      "100": {
        "$type": "color",
        "$value": {
          "colorSpace": "srgb",
          "components": [
            0.9176,
            0.9137,
            0.9843
          ],
          "hex": "#eae9fb"
        }
      },
      "200": {
        "$type": "color",
        "$value": {
          "colorSpace": "srgb",
          "components": [
            0.8392,
            0.8314,
            0.9608
          ],
          "hex": "#d6d4f5"
        }
      },
      "300": {
        "$type": "color",
        "$value": {
          "colorSpace": "srgb",
          "components": [
            0.7216,
            0.7098,
            0.9176
          ],
          "hex": "#b8b5ea"
        }
      },
      "400": {
        "$type": "color",
        "$value": {
          "colorSpace": "srgb",
          "components": [
            0.5922,
            0.5686,
            0.8627
          ],
          "hex": "#9791dc"
        }
      },
      "500": {
        "$type": "color",
        "$value": {
          "colorSpace": "srgb",
          "components": [
            0.4627,
            0.4353,
            0.7922
          ],
          "hex": "#766fca"
        }
      },
      "600": {
        "$type": "color",
        "$value": {
          "colorSpace": "srgb",
          "components": [
            0.3608,
            0.3294,
            0.6902
          ],
          "hex": "#5c54b0"
        }
      },
      "700": {
        "$type": "color",
        "$value": {
          "colorSpace": "srgb",
          "components": [
            0.2863,
            0.2588,
            0.5686
          ],
          "hex": "#494291"
        }
      },
      "800": {
        "$type": "color",
        "$value": {
          "colorSpace": "srgb",
          "components": [
            0.2196,
            0.2,
            0.4471
          ],
          "hex": "#383372"
        }
      },
      "900": {
        "$type": "color",
        "$value": {
          "colorSpace": "srgb",
          "components": [
            0.1569,
            0.1412,
            0.3294
          ],
          "hex": "#282454"
        }
      },
      "950": {
        "$type": "color",
        "$value": {
          "colorSpace": "srgb",
          "components": [
            0.0941,
            0.0824,
            0.2118
          ],
          "hex": "#181536"
        }
      }
    },
    "neutral": {
      "50": {
        "$type": "color",
        "$value": {
          "colorSpace": "srgb",
          "components": [
            0.9647,
            0.9686,
            0.949
          ],
          "hex": "#f6f7f2"
        }
      },
      "100": {
        "$type": "color",
        "$value": {
          "colorSpace": "srgb",
          "components": [
            0.9255,
            0.9373,
            0.9059
          ],
          "hex": "#ecefe7"
        }
      },
      "200": {
        "$type": "color",
        "$value": {
          "colorSpace": "srgb",
          "components": [
            0.8549,
            0.8745,
            0.8235
          ],
          "hex": "#dadfd2"
        }
      },
      "300": {
        "$type": "color",
        "$value": {
          "colorSpace": "srgb",
          "components": [
            0.7529,
            0.7804,
            0.7137
          ],
          "hex": "#c0c7b6"
        }
      },
      "400": {
        "$type": "color",
        "$value": {
          "colorSpace": "srgb",
          "components": [
            0.6275,
            0.6627,
            0.5843
          ],
          "hex": "#a0a995"
        }
      },
      "500": {
        "$type": "color",
        "$value": {
          "colorSpace": "srgb",
          "components": [
            0.5098,
            0.549,
            0.4667
          ],
          "hex": "#828c77"
        }
      },
      "600": {
        "$type": "color",
        "$value": {
          "colorSpace": "srgb",
          "components": [
            0.4078,
            0.4353,
            0.3725
          ],
          "hex": "#686f5f"
        }
      },
      "700": {
        "$type": "color",
        "$value": {
          "colorSpace": "srgb",
          "components": [
            0.3176,
            0.3412,
            0.2902
          ],
          "hex": "#51574a"
        }
      },
      "800": {
        "$type": "color",
        "$value": {
          "colorSpace": "srgb",
          "components": [
            0.2314,
            0.251,
            0.2118
          ],
          "hex": "#3b4036"
        }
      },
      "900": {
        "$type": "color",
        "$value": {
          "colorSpace": "srgb",
          "components": [
            0.1529,
            0.1686,
            0.1373
          ],
          "hex": "#272b23"
        }
      },
      "950": {
        "$type": "color",
        "$value": {
          "colorSpace": "srgb",
          "components": [
            0.0863,
            0.098,
            0.0667
          ],
          "hex": "#161911"
        }
      }
    },
    "success": {
      "50": {
        "$type": "color",
        "$value": {
          "colorSpace": "srgb",
          "components": [
            0.9333,
            0.9765,
            0.9451
          ],
          "hex": "#eef9f1"
        }
      },
      "100": {
        "$type": "color",
        "$value": {
          "colorSpace": "srgb",
          "components": [
            0.8431,
            0.9451,
            0.8706
          ],
          "hex": "#d7f1de"
        }
      },
      "200": {
        "$type": "color",
        "$value": {
          "colorSpace": "srgb",
          "components": [
            0.698,
            0.8863,
            0.749
          ],
          "hex": "#b2e2bf"
        }
      },
      "300": {
        "$type": "color",
        "$value": {
          "colorSpace": "srgb",
          "components": [
            0.5176,
            0.8039,
            0.5922
          ],
          "hex": "#84cd97"
        }
      },
      "400": {
        "$type": "color",
        "$value": {
          "colorSpace": "srgb",
          "components": [
            0.3373,
            0.7059,
            0.4353
          ],
          "hex": "#56b46f"
        }
      },
      "500": {
        "$type": "color",
        "$value": {
          "colorSpace": "srgb",
          "components": [
            0.2157,
            0.6039,
            0.3216
          ],
          "hex": "#379a52"
        }
      },
      "600": {
        "$type": "color",
        "$value": {
          "colorSpace": "srgb",
          "components": [
            0.1569,
            0.4941,
            0.2667
          ],
          "hex": "#287e44"
        }
      },
      "700": {
        "$type": "color",
        "$value": {
          "colorSpace": "srgb",
          "components": [
            0.1216,
            0.3882,
            0.2157
          ],
          "hex": "#1f6337"
        }
      },
      "800": {
        "$type": "color",
        "$value": {
          "colorSpace": "srgb",
          "components": [
            0.0902,
            0.3059,
            0.1686
          ],
          "hex": "#174e2b"
        }
      },
      "900": {
        "$type": "color",
        "$value": {
          "colorSpace": "srgb",
          "components": [
            0.0588,
            0.2235,
            0.1216
          ],
          "hex": "#0f391f"
        }
      },
      "950": {
        "$type": "color",
        "$value": {
          "colorSpace": "srgb",
          "components": [
            0.0314,
            0.1373,
            0.0706
          ],
          "hex": "#082312"
        }
      }
    },
    "warning": {
      "50": {
        "$type": "color",
        "$value": {
          "colorSpace": "srgb",
          "components": [
            0.9922,
            0.9686,
            0.9098
          ],
          "hex": "#fdf7e8"
        }
      },
      "100": {
        "$type": "color",
        "$value": {
          "colorSpace": "srgb",
          "components": [
            0.9804,
            0.9216,
            0.7843
          ],
          "hex": "#faebc8"
        }
      },
      "200": {
        "$type": "color",
        "$value": {
          "colorSpace": "srgb",
          "components": [
            0.9529,
            0.8392,
            0.6
          ],
          "hex": "#f3d699"
        }
      },
      "300": {
        "$type": "color",
        "$value": {
          "colorSpace": "srgb",
          "components": [
            0.8902,
            0.7216,
            0.3843
          ],
          "hex": "#e3b862"
        }
      },
      "400": {
        "$type": "color",
        "$value": {
          "colorSpace": "srgb",
          "components": [
            0.7882,
            0.6039,
            0.2
          ],
          "hex": "#c99a33"
        }
      },
      "500": {
        "$type": "color",
        "$value": {
          "colorSpace": "srgb",
          "components": [
            0.6706,
            0.4902,
            0.0706
          ],
          "hex": "#ab7d12"
        }
      },
      "600": {
        "$type": "color",
        "$value": {
          "colorSpace": "srgb",
          "components": [
            0.5529,
            0.4,
            0.0314
          ],
          "hex": "#8d6608"
        }
      },
      "700": {
        "$type": "color",
        "$value": {
          "colorSpace": "srgb",
          "components": [
            0.4431,
            0.3176,
            0.0157
          ],
          "hex": "#715104"
        }
      },
      "800": {
        "$type": "color",
        "$value": {
          "colorSpace": "srgb",
          "components": [
            0.3373,
            0.2392,
            0.0078
          ],
          "hex": "#563d02"
        }
      },
      "900": {
        "$type": "color",
        "$value": {
          "colorSpace": "srgb",
          "components": [
            0.2392,
            0.1647,
            0.0039
          ],
          "hex": "#3d2a01"
        }
      },
      "950": {
        "$type": "color",
        "$value": {
          "colorSpace": "srgb",
          "components": [
            0.149,
            0.0941,
            0
          ],
          "hex": "#261800"
        }
      }
    },
    "danger": {
      "50": {
        "$type": "color",
        "$value": {
          "colorSpace": "srgb",
          "components": [
            0.9922,
            0.9569,
            0.9608
          ],
          "hex": "#fdf4f5"
        }
      },
      "100": {
        "$type": "color",
        "$value": {
          "colorSpace": "srgb",
          "components": [
            0.9843,
            0.8941,
            0.9098
          ],
          "hex": "#fbe4e8"
        }
      },
      "200": {
        "$type": "color",
        "$value": {
          "colorSpace": "srgb",
          "components": [
            0.9647,
            0.7843,
            0.8157
          ],
          "hex": "#f6c8d0"
        }
      },
      "300": {
        "$type": "color",
        "$value": {
          "colorSpace": "srgb",
          "components": [
            0.9333,
            0.6235,
            0.6824
          ],
          "hex": "#ee9fae"
        }
      },
      "400": {
        "$type": "color",
        "$value": {
          "colorSpace": "srgb",
          "components": [
            0.8863,
            0.4392,
            0.5412
          ],
          "hex": "#e2708a"
        }
      },
      "500": {
        "$type": "color",
        "$value": {
          "colorSpace": "srgb",
          "components": [
            0.8118,
            0.2902,
            0.4235
          ],
          "hex": "#cf4a6c"
        }
      },
      "600": {
        "$type": "color",
        "$value": {
          "colorSpace": "srgb",
          "components": [
            0.698,
            0.1961,
            0.3373
          ],
          "hex": "#b23256"
        }
      },
      "700": {
        "$type": "color",
        "$value": {
          "colorSpace": "srgb",
          "components": [
            0.5725,
            0.1412,
            0.2667
          ],
          "hex": "#922444"
        }
      },
      "800": {
        "$type": "color",
        "$value": {
          "colorSpace": "srgb",
          "components": [
            0.4471,
            0.0902,
            0.2
          ],
          "hex": "#721733"
        }
      },
      "900": {
        "$type": "color",
        "$value": {
          "colorSpace": "srgb",
          "components": [
            0.3255,
            0.0431,
            0.1373
          ],
          "hex": "#530b23"
        }
      },
      "950": {
        "$type": "color",
        "$value": {
          "colorSpace": "srgb",
          "components": [
            0.2118,
            0.0118,
            0.0745
          ],
          "hex": "#360313"
        }
      }
    }
  },
  "radius": {
    "none": {
      "$type": "dimension",
      "$value": {
        "value": 0,
        "unit": "px"
      }
    },
    "sm": {
      "$type": "dimension",
      "$value": {
        "value": 6,
        "unit": "px"
      }
    },
    "md": {
      "$type": "dimension",
      "$value": {
        "value": 10,
        "unit": "px"
      }
    },
    "lg": {
      "$type": "dimension",
      "$value": {
        "value": 16,
        "unit": "px"
      }
    },
    "xl": {
      "$type": "dimension",
      "$value": {
        "value": 24,
        "unit": "px"
      }
    },
    "full": {
      "$type": "dimension",
      "$value": {
        "value": 9999,
        "unit": "px"
      }
    }
  },
  "space": {
    "0": {
      "$type": "dimension",
      "$value": {
        "value": 0,
        "unit": "px"
      }
    },
    "1": {
      "$type": "dimension",
      "$value": {
        "value": 4,
        "unit": "px"
      }
    },
    "2": {
      "$type": "dimension",
      "$value": {
        "value": 8,
        "unit": "px"
      }
    },
    "3": {
      "$type": "dimension",
      "$value": {
        "value": 12,
        "unit": "px"
      }
    },
    "4": {
      "$type": "dimension",
      "$value": {
        "value": 16,
        "unit": "px"
      }
    },
    "5": {
      "$type": "dimension",
      "$value": {
        "value": 20,
        "unit": "px"
      }
    },
    "6": {
      "$type": "dimension",
      "$value": {
        "value": 24,
        "unit": "px"
      }
    },
    "8": {
      "$type": "dimension",
      "$value": {
        "value": 32,
        "unit": "px"
      }
    },
    "10": {
      "$type": "dimension",
      "$value": {
        "value": 40,
        "unit": "px"
      }
    },
    "12": {
      "$type": "dimension",
      "$value": {
        "value": 48,
        "unit": "px"
      }
    },
    "16": {
      "$type": "dimension",
      "$value": {
        "value": 64,
        "unit": "px"
      }
    },
    "20": {
      "$type": "dimension",
      "$value": {
        "value": 80,
        "unit": "px"
      }
    },
    "24": {
      "$type": "dimension",
      "$value": {
        "value": 96,
        "unit": "px"
      }
    },
    "0.5": {
      "$type": "dimension",
      "$value": {
        "value": 2,
        "unit": "px"
      }
    },
    "1.5": {
      "$type": "dimension",
      "$value": {
        "value": 6,
        "unit": "px"
      }
    }
  },
  "font": {
    "display": {
      "$type": "fontFamily",
      "$value": [
        "Outfit",
        "system-ui",
        "sans-serif"
      ]
    },
    "sans": {
      "$type": "fontFamily",
      "$value": [
        "Outfit",
        "system-ui",
        "sans-serif"
      ]
    },
    "mono": {
      "$type": "fontFamily",
      "$value": [
        "Geist Mono",
        "ui-monospace",
        "monospace"
      ]
    }
  },
  "typography": {
    "display-lg": {
      "$type": "typography",
      "$value": {
        "fontFamily": "{font.display}",
        "fontSize": {
          "value": 48,
          "unit": "px"
        },
        "fontWeight": 600,
        "lineHeight": 1.1,
        "letterSpacing": {
          "value": -0.025,
          "unit": "em"
        }
      }
    },
    "display-md": {
      "$type": "typography",
      "$value": {
        "fontFamily": "{font.display}",
        "fontSize": {
          "value": 38,
          "unit": "px"
        },
        "fontWeight": 600,
        "lineHeight": 1.14,
        "letterSpacing": {
          "value": -0.02,
          "unit": "em"
        }
      }
    },
    "heading-lg": {
      "$type": "typography",
      "$value": {
        "fontFamily": "{font.display}",
        "fontSize": {
          "value": 30,
          "unit": "px"
        },
        "fontWeight": 500,
        "lineHeight": 1.2,
        "letterSpacing": {
          "value": -0.015,
          "unit": "em"
        }
      }
    },
    "heading-md": {
      "$type": "typography",
      "$value": {
        "fontFamily": "{font.sans}",
        "fontSize": {
          "value": 24,
          "unit": "px"
        },
        "fontWeight": 500,
        "lineHeight": 1.3,
        "letterSpacing": {
          "value": -0.01,
          "unit": "em"
        }
      }
    },
    "heading-sm": {
      "$type": "typography",
      "$value": {
        "fontFamily": "{font.sans}",
        "fontSize": {
          "value": 20,
          "unit": "px"
        },
        "fontWeight": 600,
        "lineHeight": 1.35,
        "letterSpacing": {
          "value": -0.005,
          "unit": "em"
        }
      }
    },
    "body-lg": {
      "$type": "typography",
      "$value": {
        "fontFamily": "{font.sans}",
        "fontSize": {
          "value": 18,
          "unit": "px"
        },
        "fontWeight": 400,
        "lineHeight": 1.6,
        "letterSpacing": {
          "value": 0,
          "unit": "em"
        }
      }
    },
    "body-md": {
      "$type": "typography",
      "$value": {
        "fontFamily": "{font.sans}",
        "fontSize": {
          "value": 16,
          "unit": "px"
        },
        "fontWeight": 400,
        "lineHeight": 1.6,
        "letterSpacing": {
          "value": 0,
          "unit": "em"
        }
      }
    },
    "body-sm": {
      "$type": "typography",
      "$value": {
        "fontFamily": "{font.sans}",
        "fontSize": {
          "value": 14,
          "unit": "px"
        },
        "fontWeight": 400,
        "lineHeight": 1.5,
        "letterSpacing": {
          "value": 0,
          "unit": "em"
        }
      }
    },
    "label": {
      "$type": "typography",
      "$value": {
        "fontFamily": "{font.sans}",
        "fontSize": {
          "value": 14,
          "unit": "px"
        },
        "fontWeight": 500,
        "lineHeight": 1.25,
        "letterSpacing": {
          "value": 0.005,
          "unit": "em"
        }
      }
    },
    "caption": {
      "$type": "typography",
      "$value": {
        "fontFamily": "{font.sans}",
        "fontSize": {
          "value": 12,
          "unit": "px"
        },
        "fontWeight": 500,
        "lineHeight": 1.4,
        "letterSpacing": {
          "value": 0.015,
          "unit": "em"
        }
      }
    },
    "code": {
      "$type": "typography",
      "$value": {
        "fontFamily": "{font.mono}",
        "fontSize": {
          "value": 13,
          "unit": "px"
        },
        "fontWeight": 400,
        "lineHeight": 1.55,
        "letterSpacing": {
          "value": 0,
          "unit": "em"
        }
      }
    }
  },
  "semantic": {
    "light": {
      "background": {
        "$type": "color",
        "$value": "{color.neutral.50}"
      },
      "foreground": {
        "$type": "color",
        "$value": "{color.neutral.950}"
      },
      "card": {
        "$type": "color",
        "$value": {
          "colorSpace": "srgb",
          "components": [
            0.9882,
            0.9922,
            0.9804
          ],
          "hex": "#fcfdfa"
        }
      },
      "card-foreground": {
        "$type": "color",
        "$value": "{color.neutral.950}"
      },
      "popover": {
        "$type": "color",
        "$value": {
          "colorSpace": "srgb",
          "components": [
            0.9882,
            0.9922,
            0.9804
          ],
          "hex": "#fcfdfa"
        }
      },
      "popover-foreground": {
        "$type": "color",
        "$value": "{color.neutral.950}"
      },
      "primary": {
        "$type": "color",
        "$value": "{color.brand.600}"
      },
      "primary-foreground": {
        "$type": "color",
        "$value": {
          "colorSpace": "srgb",
          "components": [
            1,
            1,
            1
          ],
          "hex": "#ffffff"
        }
      },
      "secondary": {
        "$type": "color",
        "$value": "{color.neutral.100}"
      },
      "secondary-foreground": {
        "$type": "color",
        "$value": "{color.neutral.900}"
      },
      "muted": {
        "$type": "color",
        "$value": "{color.neutral.100}"
      },
      "muted-foreground": {
        "$type": "color",
        "$value": "{color.neutral.700}"
      },
      "accent": {
        "$type": "color",
        "$value": "{color.brand.100}"
      },
      "accent-foreground": {
        "$type": "color",
        "$value": "{color.brand.900}"
      },
      "destructive": {
        "$type": "color",
        "$value": "{color.danger.600}"
      },
      "destructive-foreground": {
        "$type": "color",
        "$value": {
          "colorSpace": "srgb",
          "components": [
            1,
            1,
            1
          ],
          "hex": "#ffffff"
        }
      },
      "success": {
        "$type": "color",
        "$value": "{color.success.700}"
      },
      "success-foreground": {
        "$type": "color",
        "$value": {
          "colorSpace": "srgb",
          "components": [
            1,
            1,
            1
          ],
          "hex": "#ffffff"
        }
      },
      "warning": {
        "$type": "color",
        "$value": "{color.warning.200}"
      },
      "warning-foreground": {
        "$type": "color",
        "$value": "{color.warning.900}"
      },
      "border": {
        "$type": "color",
        "$value": "{color.neutral.200}"
      },
      "input": {
        "$type": "color",
        "$value": "{color.neutral.300}"
      },
      "ring": {
        "$type": "color",
        "$value": "{color.brand.500}"
      }
    },
    "dark": {
      "background": {
        "$type": "color",
        "$value": "{color.neutral.950}"
      },
      "foreground": {
        "$type": "color",
        "$value": "{color.neutral.50}"
      },
      "card": {
        "$type": "color",
        "$value": {
          "colorSpace": "srgb",
          "components": [
            0.1137,
            0.1294,
            0.098
          ],
          "hex": "#1d2119"
        }
      },
      "card-foreground": {
        "$type": "color",
        "$value": "{color.neutral.50}"
      },
      "popover": {
        "$type": "color",
        "$value": "{color.neutral.900}"
      },
      "popover-foreground": {
        "$type": "color",
        "$value": "{color.neutral.50}"
      },
      "primary": {
        "$type": "color",
        "$value": "{color.brand.400}"
      },
      "primary-foreground": {
        "$type": "color",
        "$value": "{color.brand.950}"
      },
      "secondary": {
        "$type": "color",
        "$value": "{color.neutral.800}"
      },
      "secondary-foreground": {
        "$type": "color",
        "$value": "{color.neutral.100}"
      },
      "muted": {
        "$type": "color",
        "$value": "{color.neutral.800}"
      },
      "muted-foreground": {
        "$type": "color",
        "$value": "{color.neutral.300}"
      },
      "accent": {
        "$type": "color",
        "$value": "{color.brand.900}"
      },
      "accent-foreground": {
        "$type": "color",
        "$value": "{color.brand.100}"
      },
      "destructive": {
        "$type": "color",
        "$value": "{color.danger.400}"
      },
      "destructive-foreground": {
        "$type": "color",
        "$value": "{color.danger.950}"
      },
      "success": {
        "$type": "color",
        "$value": "{color.success.400}"
      },
      "success-foreground": {
        "$type": "color",
        "$value": "{color.success.950}"
      },
      "warning": {
        "$type": "color",
        "$value": "{color.warning.400}"
      },
      "warning-foreground": {
        "$type": "color",
        "$value": "{color.warning.950}"
      },
      "border": {
        "$type": "color",
        "$value": "{color.neutral.800}"
      },
      "input": {
        "$type": "color",
        "$value": "{color.neutral.700}"
      },
      "ring": {
        "$type": "color",
        "$value": "{color.brand.400}"
      }
    }
  }
}