{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "tokens",
  "title": "Design tokens",
  "description": "ikada's design tokens as typed data: colours, type, spacing, radii, shadows, motion, springs and layers.",
  "registryDependencies": [],
  "files": [
    {
      "path": "registry/ikada/lib/ikada/tokens.ts",
      "content": "// GENERATED by scripts/build-tokens.ts from tokens/tokens.ts. Do not edit.\n\n/** ikada design tokens as data: colours, type, spacing, radii, shadows, motion and springs, layers. */\nexport const colors = {\n  dark: {\n    canvas: \"oklch(0.18 0.014 255)\",\n    surface: \"oklch(0.23 0.016 255)\",\n    well: \"oklch(0.2 0.015 255)\",\n    hover: \"oklch(0.295 0.018 255)\",\n    raised: \"oklch(0.34 0.02 255)\",\n    hairline: \"oklch(0.3 0.018 255)\",\n    \"hairline-strong\": \"oklch(0.4 0.02 255)\",\n    \"control-edge\": \"oklch(0.62 0.02 255)\",\n    focus: \"oklch(0.95 0.01 255)\",\n    fg: \"oklch(0.95 0.01 255)\",\n    \"fg-muted\": \"oklch(0.76 0.018 255)\",\n    brand: \"oklch(0.72 0.12 152)\",\n    \"brand-hover\": \"oklch(0.77 0.12 152)\",\n    \"on-brand\": \"oklch(0.2 0.03 152)\",\n    \"brand-fg\": \"oklch(0.82 0.13 152)\",\n    \"brand-soft\": \"oklch(0.31 0.045 152)\",\n    \"brand-dot\": \"oklch(0.74 0.15 152)\",\n    \"warn-fg\": \"oklch(0.88 0.1 85)\",\n    \"warn-soft\": \"oklch(0.35 0.06 80)\",\n    \"warn-dot\": \"oklch(0.8 0.14 80)\",\n    danger: \"oklch(0.68 0.14 25)\",\n    \"danger-hover\": \"oklch(0.73 0.13 25)\",\n    \"on-danger\": \"oklch(0.18 0.04 25)\",\n    \"danger-fg\": \"oklch(0.85 0.1 25)\",\n    \"danger-soft\": \"oklch(0.34 0.08 25)\",\n    \"danger-dot\": \"oklch(0.74 0.16 25)\",\n    \"info-fg\": \"oklch(0.84 0.1 255)\",\n    \"info-soft\": \"oklch(0.33 0.07 255)\",\n    \"info-dot\": \"oklch(0.76 0.13 255)\",\n    \"neutral-fg\": \"oklch(0.85 0.012 255)\",\n    \"neutral-soft\": \"oklch(0.33 0.012 255)\",\n    \"neutral-dot\": \"oklch(0.72 0.012 255)\",\n    \"code-bg\": \"oklch(0.155 0.012 255)\",\n    \"diff-add\": \"oklch(0.27 0.05 152)\",\n    \"diff-del\": \"oklch(0.27 0.06 25)\",\n    \"chart-requests\": \"oklch(0.76 0.13 255)\",\n    \"chart-errors\": \"oklch(0.74 0.16 25)\",\n    \"chart-deploy\": \"oklch(0.83 0.015 255)\",\n    \"chart-grid\": \"oklch(0.34 0.018 255)\",\n    \"chart-2xx\": \"oklch(0.76 0.16 152)\",\n    \"chart-3xx\": \"oklch(0.78 0.1 235)\",\n    \"chart-4xx\": \"oklch(0.8 0.13 80)\",\n    \"chart-5xx\": \"oklch(0.74 0.16 25)\",\n    \"chart-other\": \"oklch(0.72 0.012 255)\",\n    \"chart-series\": \"oklch(0.76 0.1 300)\",\n    scrim: \"oklch(0.06 0.012 255 / 0.62)\",\n  },\n  light: {\n    canvas: \"oklch(0.965 0 0)\",\n    surface: \"oklch(0.995 0 0)\",\n    well: \"oklch(0.962 0 0)\",\n    hover: \"oklch(0.925 0 0)\",\n    raised: \"oklch(1 0 0)\",\n    hairline: \"oklch(0.9 0 0)\",\n    \"hairline-strong\": \"oklch(0.82 0 0)\",\n    \"control-edge\": \"oklch(0.6 0 0)\",\n    focus: \"oklch(0.22 0 0)\",\n    fg: \"oklch(0.22 0 0)\",\n    \"fg-muted\": \"oklch(0.44 0 0)\",\n    brand: \"oklch(0.47 0.12 152)\",\n    \"brand-hover\": \"oklch(0.42 0.105 152)\",\n    \"on-brand\": \"oklch(0.99 0.005 150)\",\n    \"brand-fg\": \"oklch(0.42 0.11 152)\",\n    \"brand-soft\": \"oklch(0.94 0.05 150)\",\n    \"brand-dot\": \"oklch(0.62 0.16 150)\",\n    \"warn-fg\": \"oklch(0.43 0.09 70)\",\n    \"warn-soft\": \"oklch(0.95 0.06 85)\",\n    \"warn-dot\": \"oklch(0.63 0.14 72)\",\n    danger: \"oklch(0.48 0.18 25)\",\n    \"danger-hover\": \"oklch(0.43 0.18 25)\",\n    \"on-danger\": \"oklch(1 0 0)\",\n    \"danger-fg\": \"oklch(0.46 0.18 25)\",\n    \"danger-soft\": \"oklch(0.95 0.035 25)\",\n    \"danger-dot\": \"oklch(0.58 0.2 25)\",\n    \"info-fg\": \"oklch(0.42 0.14 255)\",\n    \"info-soft\": \"oklch(0.94 0.04 255)\",\n    \"info-dot\": \"oklch(0.58 0.15 255)\",\n    \"neutral-fg\": \"oklch(0.42 0 0)\",\n    \"neutral-soft\": \"oklch(0.93 0 0)\",\n    \"neutral-dot\": \"oklch(0.55 0 0)\",\n    \"code-bg\": \"oklch(0.955 0 0)\",\n    \"diff-add\": \"oklch(0.94 0.05 150)\",\n    \"diff-del\": \"oklch(0.95 0.04 25)\",\n    \"chart-requests\": \"oklch(0.55 0.15 255)\",\n    \"chart-errors\": \"oklch(0.58 0.2 25)\",\n    \"chart-deploy\": \"oklch(0.4 0 0)\",\n    \"chart-grid\": \"oklch(0.88 0 0)\",\n    \"chart-2xx\": \"oklch(0.6 0.16 150)\",\n    \"chart-3xx\": \"oklch(0.6 0.12 235)\",\n    \"chart-4xx\": \"oklch(0.62 0.135 75)\",\n    \"chart-5xx\": \"oklch(0.58 0.2 25)\",\n    \"chart-other\": \"oklch(0.55 0 0)\",\n    \"chart-series\": \"oklch(0.55 0.12 300)\",\n    scrim: \"oklch(0.25 0 260 / 0.34)\",\n  },\n} as const;\n\nexport const colorNames = [\n  \"canvas\",\n  \"surface\",\n  \"well\",\n  \"hover\",\n  \"raised\",\n  \"hairline\",\n  \"hairline-strong\",\n  \"control-edge\",\n  \"focus\",\n  \"fg\",\n  \"fg-muted\",\n  \"brand\",\n  \"brand-hover\",\n  \"on-brand\",\n  \"brand-fg\",\n  \"brand-soft\",\n  \"brand-dot\",\n  \"warn-fg\",\n  \"warn-soft\",\n  \"warn-dot\",\n  \"danger\",\n  \"danger-hover\",\n  \"on-danger\",\n  \"danger-fg\",\n  \"danger-soft\",\n  \"danger-dot\",\n  \"info-fg\",\n  \"info-soft\",\n  \"info-dot\",\n  \"neutral-fg\",\n  \"neutral-soft\",\n  \"neutral-dot\",\n  \"code-bg\",\n  \"diff-add\",\n  \"diff-del\",\n  \"chart-requests\",\n  \"chart-errors\",\n  \"chart-deploy\",\n  \"chart-grid\",\n  \"chart-2xx\",\n  \"chart-3xx\",\n  \"chart-4xx\",\n  \"chart-5xx\",\n  \"chart-other\",\n  \"chart-series\",\n  \"scrim\",\n] as const;\n\nexport const typeScale = {\n  xs: {\n    size: 12,\n    line: 16,\n    weight: 500,\n    tracking: 0,\n    use: \"Captions, keycaps, dense meta\",\n  },\n  sm: {\n    size: 13,\n    line: 20,\n    weight: 400,\n    tracking: 0,\n    use: \"Labels, helper text, table meta\",\n  },\n  base: {\n    size: 14,\n    line: 20,\n    weight: 400,\n    tracking: 0,\n    use: \"Body, controls, table cells\",\n  },\n  md: {\n    size: 15,\n    line: 22,\n    weight: 600,\n    tracking: -0.005,\n    use: \"Section titles\",\n  },\n  lg: {\n    size: 18,\n    line: 26,\n    weight: 700,\n    tracking: -0.01,\n    use: \"Dialog and panel titles\",\n  },\n  xl: {\n    size: 24,\n    line: 32,\n    weight: 700,\n    tracking: -0.015,\n    use: \"Page titles on small screens\",\n  },\n  \"2xl\": {\n    size: 28,\n    line: 36,\n    weight: 700,\n    tracking: -0.02,\n    use: \"Page titles\",\n  },\n  metric: {\n    size: 28,\n    line: 36,\n    weight: 700,\n    tracking: -0.02,\n    use: \"Hero numbers in a metric tile (proportional figures)\",\n  },\n} as const;\n\nexport const fonts = {\n  sans: '\"Figtree Variable\", \"Figtree\", ui-sans-serif, system-ui, -apple-system, \"Segoe UI\", sans-serif',\n  mono: '\"JetBrains Mono Variable\", \"JetBrains Mono\", ui-monospace, SFMono-Regular, Menlo, monospace',\n} as const;\n\nexport const spacing = {\n  base: 4,\n  steps: [0, 1, 2, 3, 4, 5, 6, 8, 10, 12, 16],\n  layout: {\n    gutter: 16,\n    page: 24,\n    section: 24,\n  },\n} as const;\n\nexport const radius = {\n  xs: {\n    px: 4,\n    use: \"Keycaps, icon boxes inside a 8px control (8 - 4)\",\n  },\n  sm: {\n    px: 6,\n    use: \"Rows and segments inside a 10px well (10 - 4)\",\n  },\n  md: {\n    px: 8,\n    use: \"Buttons, inputs, selects, menu items, tabs\",\n  },\n  lg: {\n    px: 10,\n    use: \"Wells, tab lists, code blocks\",\n  },\n  xl: {\n    px: 12,\n    use: \"Cards, popovers, menus, dialogs, toasts (8 + 4)\",\n  },\n  \"2xl\": {\n    px: 14,\n    use: \"Command palette (8 + 6)\",\n  },\n  full: {\n    px: 9999,\n    use: \"Badges, status pills, switch\",\n  },\n} as const;\n\nexport const border = {\n  hairline: {\n    px: 1,\n    use: \"Dividers and table rules only; surfaces separate by tone and shadow\",\n  },\n  focus: {\n    px: 2,\n    use: \"Focus ring (neutral ink)\",\n  },\n} as const;\n\nexport const shadow = {\n  dark: {\n    card: \"0 0 0 1px oklch(1 0 0 / 0.06), inset 0 1px 0 oklch(1 0 0 / 0.04), 0 10px 24px -14px oklch(0 0 0 / 0.5)\",\n    \"card-hover\":\n      \"0 0 0 1px oklch(1 0 0 / 0.09), inset 0 1px 0 oklch(1 0 0 / 0.05), 0 18px 32px -14px oklch(0 0 0 / 0.6)\",\n    button: \"inset 0 0 0 1px oklch(1 0 0 / 0.09), inset 0 1px 0 oklch(1 0 0 / 0.04), 0 1px 2px oklch(0 0 0 / 0.3)\",\n    \"button-hover\":\n      \"inset 0 0 0 1px oklch(1 0 0 / 0.12), inset 0 1px 0 oklch(1 0 0 / 0.05), 0 3px 8px -2px oklch(0 0 0 / 0.45)\",\n    \"button-pressed\": \"inset 0 0 0 1px oklch(1 0 0 / 0.1), inset 0 2px 3px oklch(0 0 0 / 0.3)\",\n    primary:\n      \"inset 0 1px 0 oklch(1 0 0 / 0.35), 0 1px 2px oklch(0 0 0 / 0.4), 0 6px 14px -6px oklch(0.6 0.12 152 / 0.4)\",\n    \"primary-hover\":\n      \"inset 0 1px 0 oklch(1 0 0 / 0.4), 0 2px 4px oklch(0 0 0 / 0.4), 0 10px 20px -6px oklch(0.6 0.12 152 / 0.5)\",\n    \"primary-pressed\": \"inset 0 2px 3px oklch(0.2 0.06 152 / 0.45)\",\n    field: \"inset 0 0 0 1px var(--sb-control-edge)\",\n    \"field-hover\": \"inset 0 0 0 1px var(--sb-fg-muted)\",\n    tray: \"inset 0 1px 2px oklch(0 0 0 / 0.35), inset 0 0 0 1px oklch(1 0 0 / 0.04)\",\n    pill: \"0 0 0 1px oklch(1 0 0 / 0.1), inset 0 1px 0 oklch(1 0 0 / 0.08), 0 1px 3px oklch(0 0 0 / 0.4)\",\n    float:\n      \"0 0 0 1px oklch(1 0 0 / 0.11), inset 0 1px 0 oklch(1 0 0 / 0.08), 0 2px 4px oklch(0 0 0 / 0.35), 0 18px 44px -6px oklch(0 0 0 / 0.65)\",\n    dialog:\n      \"0 0 0 1px oklch(1 0 0 / 0.11), inset 0 1px 0 oklch(1 0 0 / 0.08), 0 4px 8px oklch(0 0 0 / 0.35), 0 28px 72px -8px oklch(0 0 0 / 0.75)\",\n  },\n  light: {\n    card: \"0 0 0 1px oklch(0.22 0 0 / 0.06), 0 1px 2px oklch(0.3 0 0 / 0.05), 0 10px 24px -14px oklch(0.3 0 0 / 0.18)\",\n    \"card-hover\":\n      \"0 0 0 1px oklch(0.22 0 0 / 0.08), 0 2px 4px oklch(0.3 0 0 / 0.06), 0 18px 32px -14px oklch(0.3 0 0 / 0.26)\",\n    button: \"inset 0 0 0 1px oklch(0.22 0 0 / 0.09), 0 1px 2px oklch(0.3 0 0 / 0.06)\",\n    \"button-hover\": \"inset 0 0 0 1px oklch(0.22 0 0 / 0.11), 0 3px 8px -2px oklch(0.3 0 0 / 0.14)\",\n    \"button-pressed\": \"inset 0 0 0 1px oklch(0.22 0 0 / 0.12), inset 0 2px 3px oklch(0.3 0 0 / 0.08)\",\n    primary:\n      \"inset 0 1px 0 oklch(1 0 0 / 0.22), 0 1px 2px oklch(0.3 0.08 152 / 0.3), 0 6px 14px -6px oklch(0.3 0.1 152 / 0.45)\",\n    \"primary-hover\":\n      \"inset 0 1px 0 oklch(1 0 0 / 0.26), 0 2px 4px oklch(0.3 0.08 152 / 0.3), 0 10px 20px -6px oklch(0.3 0.1 152 / 0.5)\",\n    \"primary-pressed\": \"inset 0 2px 3px oklch(0.2 0.06 152 / 0.3)\",\n    field: \"inset 0 0 0 1px var(--sb-control-edge)\",\n    \"field-hover\": \"inset 0 0 0 1px var(--sb-fg-muted)\",\n    tray: \"inset 0 1px 2px oklch(0.3 0 0 / 0.08), inset 0 0 0 1px oklch(0.22 0 0 / 0.04)\",\n    pill: \"0 0 0 1px oklch(0.22 0 0 / 0.07), 0 1px 2px oklch(0.3 0 0 / 0.1), 0 4px 8px -4px oklch(0.3 0 0 / 0.16)\",\n    float:\n      \"0 0 0 1px oklch(0.22 0 0 / 0.08), 0 2px 4px -1px oklch(0.3 0 0 / 0.1), 0 12px 28px -8px oklch(0.3 0 0 / 0.22), 0 24px 48px -16px oklch(0.3 0 0 / 0.22)\",\n    dialog:\n      \"0 0 0 1px oklch(0.22 0 0 / 0.08), 0 4px 8px -2px oklch(0.3 0 0 / 0.12), 0 24px 48px -12px oklch(0.3 0 0 / 0.28), 0 48px 96px -24px oklch(0.3 0 0 / 0.3)\",\n  },\n} as const;\n\nexport const motion = {\n  duration: {\n    hover: 120,\n    press: 90,\n    \"tooltip-in\": 150,\n    \"tooltip-out\": 100,\n    \"popup-in\": 140,\n    \"popup-out\": 110,\n    \"dialog-in\": 220,\n    \"dialog-out\": 150,\n    slide: 250,\n    \"toast-in\": 300,\n    \"toast-out\": 110,\n    wake: 520,\n  },\n  easing: {\n    out: \"cubic-bezier(0.23, 1, 0.32, 1)\",\n    \"in-out\": \"cubic-bezier(0.77, 0, 0.175, 1)\",\n    hover: \"ease\",\n  },\n  spring: {\n    smooth: {\n      seconds: 0.35,\n      bounce: 0,\n      use: \"Dialogs and drawers arriving; no overshoot\",\n    },\n    snappy: {\n      seconds: 0.35,\n      bounce: 0.15,\n      use: \"Popups, toasts, the segmented and tab pebble, the switch thumb\",\n    },\n    bob: {\n      seconds: 0.45,\n      bounce: 0.25,\n      use: \"Release of a press, a checkbox filling, a success glyph landing\",\n    },\n  },\n  reducedSpring: {\n    duration: 160,\n    easing: \"cubic-bezier(0.23, 1, 0.32, 1)\",\n  },\n  scale: {\n    popup: 0.96,\n    dialog: 0.96,\n    press: 0.97,\n    icon: 0.25,\n  },\n  offset: {\n    press: 1,\n    wake: 6,\n  },\n} as const;\n\nexport const zIndex = {\n  base: 0,\n  sticky: 20,\n  overlay: 50,\n  modal: 60,\n  dropdown: 65,\n  popover: 70,\n  toast: 80,\n  tooltip: 90,\n} as const;\n\nexport const breakpoints = {\n  sm: {\n    rem: 40,\n    use: \"Large phones, landscape\",\n  },\n  md: {\n    rem: 48,\n    use: \"Tablets, sidebar becomes a rail\",\n  },\n  lg: {\n    rem: 64,\n    use: \"Laptops, sidebar fully open\",\n  },\n  xl: {\n    rem: 80,\n    use: \"Desktops\",\n  },\n  \"2xl\": {\n    rem: 96,\n    use: \"Wide screens, content stops growing at 1280px\",\n  },\n} as const;\n\nexport const density = {\n  comfortable: {\n    control: 36,\n    controlSm: 28,\n    row: 48,\n  },\n  compact: {\n    control: 32,\n    controlSm: 24,\n    row: 36,\n  },\n} as const;\n\nexport type ColorToken = (typeof colorNames)[number];\n\n/** `var(--sb-<name>)` reference for use in inline styles and charts. */\nexport const colorVar = (name: ColorToken): string => `var(--sb-${name})`;\n",
      "type": "registry:lib",
      "target": "@components/ikada/lib/tokens.ts"
    }
  ],
  "categories": [
    "utilities",
    "theme"
  ],
  "type": "registry:lib"
}