{
  "$schema": "https://ui.shadcn.com/schema/registry.json",
  "name": "liquid",
  "homepage": "http://localhost:5173",
  "items": [
    {
      "name": "liquid-theme",
      "type": "registry:theme",
      "title": "Liquid Theme",
      "description": "Colour, type and glass tokens for the liquid system, plus the .lq-glass / .lq-solid / .lq-squircle layer. Installed automatically with any liquid component.",
      "dependencies": [
        "@fontsource-variable/outfit",
        "@fontsource-variable/dm-sans",
        "@fontsource-variable/jetbrains-mono"
      ],
      "files": [],
      "cssVars": {
        "theme": {
          "--font-display": "'Outfit Variable', ui-sans-serif, system-ui, sans-serif",
          "--font-sans": "'DM Sans Variable', ui-sans-serif, system-ui, sans-serif",
          "--font-mono": "'JetBrains Mono Variable', ui-monospace, monospace",
          "--color-ink": "var(--lq-ink)",
          "--color-paper": "var(--lq-paper)",
          "--color-chalk": "var(--lq-chalk)",
          "--color-flare": "var(--lq-flare)",
          "--color-volt": "var(--lq-volt)",
          "--color-plum": "var(--lq-plum)",
          "--color-rose": "var(--lq-rose)",
          "--color-olive": "var(--lq-olive)",
          "--color-amber": "var(--lq-amber)",
          "--color-slate": "var(--lq-slate)",
          "--blur-glass": "var(--lq-blur)"
        }
      },
      "css": {
        ":root": {
          "--lq-ink": "oklch(0.15 0 0)",
          "--lq-paper": "oklch(0.951 0.005 91)",
          "--lq-chalk": "oklch(1 0 0)",
          "--lq-flare": "oklch(0.665 0.222 36)",
          "--lq-volt": "oklch(0.905 0.164 105)",
          "--lq-plum": "oklch(0.42 0.062 341)",
          "--lq-rose": "oklch(0.7 0.078 27)",
          "--lq-olive": "oklch(0.72 0.09 110)",
          "--lq-amber": "oklch(0.85 0.098 82)",
          "--lq-slate": "oklch(0.68 0.037 245)",
          "--lq-light-angle": "152deg",
          "--lq-blur": "20px",
          "--lq-sat": "1.7",
          "--lq-brightness": "1.06",
          "--lq-tint": "255 255 255",
          "--lq-tint-a": "0.2",
          "--lq-rim-w": "1px",
          "--lq-rim-hi": "0.75",
          "--lq-rim-lo": "0.06",
          "--lq-sheen": "0.26",
          "--lq-cast": "0 22px 50px -22px rgb(0 0 0 / 0.4), 0 4px 14px -6px rgb(0 0 0 / 0.18)",
          "--lq-grain": "0.09"
        },
        ".dark": {
          "--lq-tint": "255 255 255",
          "--lq-tint-a": "0.1",
          "--lq-rim-hi": "0.5",
          "--lq-rim-lo": "0.03",
          "--lq-sheen": "0.1",
          "--lq-brightness": "1",
          "--lq-cast": "0 26px 60px -24px rgb(0 0 0 / 0.75), 0 4px 14px -6px rgb(0 0 0 / 0.4)"
        },
        "@layer base": {
          "[data-lq-numeric]": {
            "font-variant-numeric": "tabular-nums lining-nums",
            "font-feature-settings": "\"tnum\" 1, \"lnum\" 1"
          }
        },
        "@layer components": {
          ".lq-glass": {
            "position": "relative",
            "isolation": "isolate",
            "background-color": "rgb(var(--lq-tint) / var(--lq-tint-a))",
            "backdrop-filter": "blur(var(--lq-blur)) saturate(var(--lq-sat)) brightness(var(--lq-brightness))",
            "-webkit-backdrop-filter": "blur(var(--lq-blur)) saturate(var(--lq-sat)) brightness(var(--lq-brightness))",
            "box-shadow": "var(--lq-cast)",
            "&::before": {
              "content": "\"\"",
              "position": "absolute",
              "inset": "0",
              "border-radius": "inherit",
              "pointer-events": "none",
              "z-index": "-1",
              "background": "linear-gradient(var(--lq-light-angle), rgb(255 255 255 / var(--lq-sheen)) 0%, rgb(255 255 255 / 0) 42%, rgb(255 255 255 / 0) 100%)"
            },
            "&::after": {
              "content": "\"\"",
              "position": "absolute",
              "inset": "0",
              "border-radius": "inherit",
              "pointer-events": "none",
              "padding": "var(--lq-rim-w)",
              "background": "linear-gradient(var(--lq-light-angle), rgb(255 255 255 / var(--lq-rim-hi)) 0%, rgb(255 255 255 / var(--lq-rim-lo)) 45%, rgb(255 255 255 / calc(var(--lq-rim-lo) * 0.5)) 60%, rgb(255 255 255 / calc(var(--lq-rim-hi) * 0.45)) 100%)",
              "mask": "linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0)",
              "mask-composite": "exclude",
              "-webkit-mask": "linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0)",
              "-webkit-mask-composite": "xor"
            }
          },
          ".lq-solid": {
            "position": "relative",
            "isolation": "isolate",
            "background-color": "var(--lq-chalk)",
            "box-shadow": "var(--lq-cast)"
          },
          ".dark .lq-solid": {
            "background-color": "oklch(0.22 0 0)"
          },
          ".lq-grain": {
            "position": "absolute",
            "inset": "0",
            "border-radius": "inherit",
            "pointer-events": "none",
            "opacity": "var(--lq-grain)",
            "mix-blend-mode": "overlay",
            "background-image": "url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E\")"
          },
          ".lq-squircle": {
            "border-radius": "var(--lq-corner, 28px)"
          },
          "@supports (corner-shape: squircle)": {
            ".lq-squircle": {
              "corner-shape": "squircle",
              "border-radius": "calc(var(--lq-corner, 28px) * 1.32)"
            }
          }
        },
        "@layer utilities": {
          ".lq-ease": {
            "transition-timing-function": "cubic-bezier(0.32, 0.72, 0, 1)"
          },
          ".lq-mesh-drift": {
            "animation": "lq-drift 34s ease-in-out infinite alternate"
          }
        },
        "@keyframes lq-drift": {
          "0%": {
            "transform": "translate3d(0, 0, 0) scale(1) rotate(0deg)"
          },
          "50%": {
            "transform": "translate3d(2%, -3%, 0) scale(1.08) rotate(3deg)"
          },
          "100%": {
            "transform": "translate3d(-3%, 2%, 0) scale(1.04) rotate(-2deg)"
          }
        }
      }
    },
    {
      "name": "liquid-path",
      "type": "registry:lib",
      "title": "Liquid Path",
      "description": "Scale, smoothing and arc helpers shared by the liquid chart components.",
      "files": [
        {
          "path": "src/lib/liquid-path.ts",
          "type": "registry:lib"
        }
      ]
    },
    {
      "name": "glass-surface",
      "type": "registry:ui",
      "title": "Glass Surface",
      "description": "The frosted primitive every other liquid component is built from: squircle corners, a directional rim, and a specular sheen driven by one shared light angle.",
      "dependencies": [
        "class-variance-authority"
      ],
      "registryDependencies": [
        "http://localhost:5173/r/liquid-theme.json"
      ],
      "files": [
        {
          "path": "src/components/ui/glass-surface.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "mesh-backdrop",
      "type": "registry:ui",
      "title": "Mesh Backdrop",
      "description": "Layered radial-gradient grounds with optional film grain and slow convection. Six presets sampled from the reference frames.",
      "registryDependencies": [
        "http://localhost:5173/r/liquid-theme.json"
      ],
      "files": [
        {
          "path": "src/components/ui/mesh-backdrop.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "action-orb",
      "type": "registry:ui",
      "title": "Action Orb",
      "description": "The filled circular arrow button that opens a tile. Five variants: ink, chalk, glass, hairline, flare.",
      "dependencies": [
        "class-variance-authority",
        "lucide-react",
        "radix-ui"
      ],
      "registryDependencies": [
        "http://localhost:5173/r/liquid-theme.json"
      ],
      "files": [
        {
          "path": "src/components/ui/action-orb.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "icon-ring",
      "type": "registry:ui",
      "title": "Icon Ring",
      "description": "The outlined circle holding a tile's category icon, with an optional alert badge. The visual counterweight to Action Orb.",
      "dependencies": [
        "class-variance-authority"
      ],
      "registryDependencies": [
        "http://localhost:5173/r/liquid-theme.json"
      ],
      "files": [
        {
          "path": "src/components/ui/icon-ring.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "stat-value",
      "type": "registry:ui",
      "title": "Stat Value",
      "description": "Oversized numerals with a built-in hierarchy: the leading group carries the weight, thousands drop to half size, the currency mark and unit sit smaller still.",
      "dependencies": [
        "class-variance-authority"
      ],
      "registryDependencies": [
        "http://localhost:5173/r/liquid-theme.json"
      ],
      "files": [
        {
          "path": "src/components/ui/stat-value.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "delta-pill",
      "type": "registry:ui",
      "title": "Delta Pill",
      "description": "Directional change readout — `▲ 6 from 1h ago`. Bare, pill, outline and solid containers.",
      "dependencies": [
        "class-variance-authority"
      ],
      "registryDependencies": [
        "http://localhost:5173/r/liquid-theme.json"
      ],
      "files": [
        {
          "path": "src/components/ui/delta-pill.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "dot-matrix",
      "type": "registry:ui",
      "title": "Dot Matrix",
      "description": "A 5×7 bitmap numeral face for sensor readouts. Dot, square and LED variants.",
      "dependencies": [
        "class-variance-authority"
      ],
      "registryDependencies": [
        "http://localhost:5173/r/liquid-theme.json"
      ],
      "files": [
        {
          "path": "src/components/ui/dot-matrix.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "spark-line",
      "type": "registry:ui",
      "title": "Spark Line",
      "description": "Dependency-free sparkline glyph: line, filled area, or line with local maxima marked.",
      "dependencies": [
        "class-variance-authority"
      ],
      "registryDependencies": [
        "http://localhost:5173/r/liquid-theme.json",
        "http://localhost:5173/r/liquid-path.json"
      ],
      "files": [
        {
          "path": "src/components/ui/spark-line.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "micro-bars",
      "type": "registry:ui",
      "title": "Micro Bars",
      "description": "Thin bar glyph off a shared baseline, with column, pill and mirror variants and optional recency fade.",
      "dependencies": [
        "class-variance-authority"
      ],
      "registryDependencies": [
        "http://localhost:5173/r/liquid-theme.json"
      ],
      "files": [
        {
          "path": "src/components/ui/micro-bars.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "wave-field",
      "type": "registry:ui",
      "title": "Wave Field",
      "description": "A periodic glyph encoding rhythm rather than trend. Arcade, sine and pulse variants.",
      "dependencies": [
        "class-variance-authority"
      ],
      "registryDependencies": [
        "http://localhost:5173/r/liquid-theme.json",
        "http://localhost:5173/r/liquid-path.json"
      ],
      "files": [
        {
          "path": "src/components/ui/wave-field.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "dot-field",
      "type": "registry:ui",
      "title": "Dot Field",
      "description": "A dot grid for small counts. Count, density and deterministic stipple variants.",
      "dependencies": [
        "class-variance-authority"
      ],
      "registryDependencies": [
        "http://localhost:5173/r/liquid-theme.json"
      ],
      "files": [
        {
          "path": "src/components/ui/dot-field.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "progress-dots",
      "type": "registry:ui",
      "title": "Progress Dots",
      "description": "A short run of marks with an emphasized terminal. Dots, rings, steps and numbered variants.",
      "dependencies": [
        "class-variance-authority"
      ],
      "registryDependencies": [
        "http://localhost:5173/r/liquid-theme.json"
      ],
      "files": [
        {
          "path": "src/components/ui/progress-dots.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "gauge-arc",
      "type": "registry:ui",
      "title": "Gauge Arc",
      "description": "The credit-score dial: track, progressed arc and hairline needle. Needle, arc and ticks variants.",
      "dependencies": [
        "class-variance-authority"
      ],
      "registryDependencies": [
        "http://localhost:5173/r/liquid-theme.json",
        "http://localhost:5173/r/liquid-path.json"
      ],
      "files": [
        {
          "path": "src/components/ui/gauge-arc.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "ring-stat",
      "type": "registry:ui",
      "title": "Ring Stat",
      "description": "A hairline circle marking a reading with a bright petal instead of a filled bar. Flourish, progress and dual variants.",
      "dependencies": [
        "class-variance-authority"
      ],
      "registryDependencies": [
        "http://localhost:5173/r/liquid-theme.json",
        "http://localhost:5173/r/liquid-path.json"
      ],
      "files": [
        {
          "path": "src/components/ui/ring-stat.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "trend-line",
      "type": "registry:ui",
      "title": "Trend Line",
      "description": "The full sensor chart: crossing curves, dashed gridlines with right-hand labels, point annotations, and a called-out reading with a drop line.",
      "registryDependencies": [
        "http://localhost:5173/r/liquid-theme.json",
        "http://localhost:5173/r/liquid-path.json"
      ],
      "files": [
        {
          "path": "src/components/ui/trend-line.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "feather-image",
      "type": "registry:ui",
      "title": "Feather Image",
      "description": "An image with no edge — the frame is dissolved with a mask so the photo bleeds into whatever ground it sits on. Bleed, bloom and veil masks, with optional blur and grain.",
      "dependencies": [
        "class-variance-authority"
      ],
      "registryDependencies": [
        "http://localhost:5173/r/liquid-theme.json"
      ],
      "files": [
        {
          "path": "src/components/ui/feather-image.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "route-line",
      "type": "registry:ui",
      "title": "Route Line",
      "description": "A switchback trail that runs, turns back through a half-circle, runs again and ends in a marker. Drawn furniture for hero space.",
      "dependencies": [
        "class-variance-authority"
      ],
      "registryDependencies": [
        "http://localhost:5173/r/liquid-theme.json"
      ],
      "files": [
        {
          "path": "src/components/ui/route-line.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "info-pill",
      "type": "registry:ui",
      "title": "Info Pill",
      "description": "A fact wearing a pill — icon or tabular numeric marker, then a label. Static by design. Six materials.",
      "dependencies": [
        "class-variance-authority"
      ],
      "registryDependencies": [
        "http://localhost:5173/r/liquid-theme.json"
      ],
      "files": [
        {
          "path": "src/components/ui/info-pill.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "glass-select",
      "type": "registry:ui",
      "title": "Glass Select",
      "description": "A wide pill that states its current choice in full, on Radix Select. Solid, glass, ink and hairline materials.",
      "dependencies": [
        "class-variance-authority",
        "radix-ui",
        "lucide-react"
      ],
      "registryDependencies": [
        "http://localhost:5173/r/liquid-theme.json"
      ],
      "files": [
        {
          "path": "src/components/ui/glass-select.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "media-rail",
      "type": "registry:ui",
      "title": "Media Rail",
      "description": "A frosted tray of thumbnails with one frame live. Give a frame a YouTube id and it plays in place, with the ring around it doubling as the progress track. No third-party script; the embed is driven over postMessage and nothing is fetched until first press.",
      "dependencies": [
        "class-variance-authority",
        "lucide-react"
      ],
      "registryDependencies": [
        "http://localhost:5173/r/liquid-theme.json"
      ],
      "files": [
        {
          "path": "src/components/ui/media-rail.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "agenda-rail",
      "type": "registry:ui",
      "title": "Agenda Rail",
      "description": "A right-aligned run of pills with a deliberately ragged left edge, for itineraries and schedules.",
      "dependencies": [
        "class-variance-authority"
      ],
      "registryDependencies": [
        "http://localhost:5173/r/liquid-theme.json",
        "http://localhost:5173/r/info-pill.json"
      ],
      "files": [
        {
          "path": "src/components/ui/agenda-rail.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "segmented-control",
      "type": "registry:ui",
      "title": "Segmented Control",
      "description": "Single-selection pill navigation on Radix ToggleGroup. Bare, track and glass containers; ink, chalk and glass tones.",
      "dependencies": [
        "class-variance-authority",
        "radix-ui"
      ],
      "registryDependencies": [
        "http://localhost:5173/r/liquid-theme.json",
        "toggle-group"
      ],
      "files": [
        {
          "path": "src/components/ui/segmented-control.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "chip-group",
      "type": "registry:ui",
      "title": "Chip Group",
      "description": "Single or multi-select filter chips on Radix ToggleGroup. Hairline, wash, glass and solid variants.",
      "dependencies": [
        "class-variance-authority",
        "radix-ui"
      ],
      "registryDependencies": [
        "http://localhost:5173/r/liquid-theme.json",
        "toggle-group"
      ],
      "files": [
        {
          "path": "src/components/ui/chip-group.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "user-chip",
      "type": "registry:ui",
      "title": "User Chip",
      "description": "Avatar with a two-line identity block. Bare, glass, outline and compact variants, with a reversed order for right-aligned headers.",
      "dependencies": [
        "class-variance-authority"
      ],
      "registryDependencies": [
        "http://localhost:5173/r/liquid-theme.json",
        "avatar"
      ],
      "files": [
        {
          "path": "src/components/ui/user-chip.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "metric-card",
      "type": "registry:ui",
      "title": "Metric Card",
      "description": "The dashboard tile: category mark, action, label and number. Stack, ledger and billboard layouts across glass, solid and ink materials.",
      "dependencies": [
        "class-variance-authority",
        "lucide-react"
      ],
      "registryDependencies": [
        "http://localhost:5173/r/liquid-theme.json",
        "http://localhost:5173/r/glass-surface.json",
        "http://localhost:5173/r/action-orb.json",
        "http://localhost:5173/r/icon-ring.json",
        "http://localhost:5173/r/stat-value.json"
      ],
      "files": [
        {
          "path": "src/components/ui/metric-card.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "offer-card",
      "type": "registry:ui",
      "title": "Offer Card",
      "description": "A tinted glass card carrying a provider and two or more peer terms. Five tints, column and row layouts.",
      "dependencies": [
        "class-variance-authority"
      ],
      "registryDependencies": [
        "http://localhost:5173/r/liquid-theme.json",
        "http://localhost:5173/r/glass-surface.json",
        "http://localhost:5173/r/icon-ring.json"
      ],
      "files": [
        {
          "path": "src/components/ui/offer-card.tsx",
          "type": "registry:ui"
        }
      ]
    }
  ]
}