@qpmtx/tokens 0.3.0

package/dist/groups/colors-and-gradients.js

@@ -0,0 +1,644 @@
+/**
+ * QPMatrix design tokens - group: colors-and-gradients
+ *
+ * AUTO-TRANSCRIBED from the owner's design source (tokens.json / tokens.css extracted
+ * from the QPMatrix Design System export). Do not hand-edit values here - regenerate
+ * from the live source per packages/.agents/skills/tokens/SKILL.md instead.
+ *
+ * Each entry mirrors the source JSON 1:1:
+ *   raw    - the literal CSS declaration value (may reference other vars)
+ *   resolved - raw fully dereferenced down to a literal (hex/rgba/px/...)
+ *   light  - present only for tokens overridden by [data-theme="light"]
+ *   usedByComponentBundle - whether the owner's component bundle references this token
+ */
+export const colorsAndGradients = {
+    "amber-400": {
+        raw: "#FFC24D",
+        resolved: "#FFC24D",
+        usedByComponentBundle: false,
+    },
+    "amber-500": {
+        raw: "#F5A623",
+        resolved: "#F5A623",
+        usedByComponentBundle: false,
+    },
+    "amber-600": {
+        raw: "#CC8412",
+        resolved: "#CC8412",
+        usedByComponentBundle: false,
+    },
+    "bg-canvas": {
+        raw: "var(--graphite-1000)",
+        resolved: "#070A0F",
+        light: {
+            raw: "var(--graphite-100)",
+            resolved: "#F1F5F9",
+        },
+        usedByComponentBundle: false,
+    },
+    "bg-elevated": {
+        raw: "var(--graphite-900)",
+        resolved: "#121722",
+        light: {
+            raw: "var(--graphite-0)",
+            resolved: "#FFFFFF",
+        },
+        usedByComponentBundle: false,
+    },
+    "bg-inverse": {
+        raw: "var(--graphite-50)",
+        resolved: "#F8FAFC",
+        light: {
+            raw: "var(--graphite-950)",
+            resolved: "#0D1117",
+        },
+        usedByComponentBundle: false,
+    },
+    "bg-overlay": {
+        raw: "rgba(7,10,15,0.75)",
+        resolved: "rgba(7,10,15,0.75)",
+        light: {
+            raw: "rgba(13,17,23,0.40)",
+            resolved: "rgba(13,17,23,0.40)",
+        },
+        usedByComponentBundle: true,
+    },
+    "bg-subtle": {
+        raw: "var(--graphite-950)",
+        resolved: "#0D1117",
+        light: {
+            raw: "var(--graphite-50)",
+            resolved: "#F8FAFC",
+        },
+        usedByComponentBundle: false,
+    },
+    "blue-400": {
+        raw: "#60A5FA",
+        resolved: "#60A5FA",
+        usedByComponentBundle: true,
+    },
+    "blue-500": {
+        raw: "#3B82F6",
+        resolved: "#3B82F6",
+        usedByComponentBundle: false,
+    },
+    "blue-600": {
+        raw: "#2563EB",
+        resolved: "#2563EB",
+        usedByComponentBundle: false,
+    },
+    "blue-700": {
+        raw: "#1D4ED8",
+        resolved: "#1D4ED8",
+        usedByComponentBundle: false,
+    },
+    "border-default": {
+        raw: "var(--graphite-700)",
+        resolved: "#2B3442",
+        light: {
+            raw: "var(--graphite-300)",
+            resolved: "#CBD5E1",
+        },
+        usedByComponentBundle: true,
+    },
+    "border-focus": {
+        raw: "var(--violet-400)",
+        resolved: "#A78BFA",
+        light: {
+            raw: "var(--violet-600)",
+            resolved: "#7C3AED",
+        },
+        usedByComponentBundle: false,
+    },
+    "border-interactive": {
+        raw: "var(--violet-600)",
+        resolved: "#7C3AED",
+        light: {
+            raw: "var(--violet-600)",
+            resolved: "#7C3AED",
+        },
+        usedByComponentBundle: true,
+    },
+    "border-selected": {
+        raw: "var(--violet-500)",
+        resolved: "#8B5CF6",
+        light: {
+            raw: "var(--violet-600)",
+            resolved: "#7C3AED",
+        },
+        usedByComponentBundle: true,
+    },
+    "border-strong": {
+        raw: "var(--graphite-600)",
+        resolved: "#46536A",
+        light: {
+            raw: "var(--graphite-400)",
+            resolved: "#94A3B8",
+        },
+        usedByComponentBundle: true,
+    },
+    "border-subtle": {
+        raw: "var(--graphite-700)",
+        resolved: "#2B3442",
+        light: {
+            raw: "var(--graphite-200)",
+            resolved: "#E2E8F0",
+        },
+        usedByComponentBundle: true,
+    },
+    "brand-foreground": {
+        raw: "var(--graphite-50)",
+        resolved: "#F8FAFC",
+        light: {
+            raw: "var(--graphite-0)",
+            resolved: "#FFFFFF",
+        },
+        usedByComponentBundle: true,
+    },
+    "brand-glow": {
+        raw: "var(--glow-violet)",
+        resolved: "rgba(124,58,237,0.45)",
+        light: {
+            raw: "rgba(124,58,237,0.20)",
+            resolved: "rgba(124,58,237,0.20)",
+        },
+        usedByComponentBundle: false,
+    },
+    "brand-primary": {
+        raw: "var(--violet-500)",
+        resolved: "#8B5CF6",
+        light: {
+            raw: "var(--violet-600)",
+            resolved: "#7C3AED",
+        },
+        usedByComponentBundle: true,
+    },
+    "brand-strong": {
+        raw: "var(--violet-600)",
+        resolved: "#7C3AED",
+        light: {
+            raw: "var(--violet-700)",
+            resolved: "#6426C7",
+        },
+        usedByComponentBundle: true,
+    },
+    "brand-subtle": {
+        raw: "rgba(139,92,246,0.12)",
+        resolved: "rgba(139,92,246,0.12)",
+        light: {
+            raw: "rgba(124,58,237,0.08)",
+            resolved: "rgba(124,58,237,0.08)",
+        },
+        usedByComponentBundle: true,
+    },
+    "cyan-300": {
+        raw: "#67E8F9",
+        resolved: "#67E8F9",
+        usedByComponentBundle: false,
+    },
+    "cyan-400": {
+        raw: "#22D3EE",
+        resolved: "#22D3EE",
+        usedByComponentBundle: false,
+    },
+    "cyan-500": {
+        raw: "#06B6D4",
+        resolved: "#06B6D4",
+        usedByComponentBundle: false,
+    },
+    "cyan-600": {
+        raw: "#0891B2",
+        resolved: "#0891B2",
+        usedByComponentBundle: false,
+    },
+    "cyan-700": {
+        raw: "#0E7490",
+        resolved: "#0E7490",
+        usedByComponentBundle: false,
+    },
+    "cyan-800": {
+        raw: "#155E75",
+        resolved: "#155E75",
+        usedByComponentBundle: false,
+    },
+    "cyan-900": {
+        raw: "#083344",
+        resolved: "#083344",
+        usedByComponentBundle: false,
+    },
+    "fg-disabled": {
+        raw: "var(--graphite-600)",
+        resolved: "#46536A",
+        light: {
+            raw: "var(--graphite-400)",
+            resolved: "#94A3B8",
+        },
+        usedByComponentBundle: true,
+    },
+    "fg-inverse": {
+        raw: "var(--graphite-950)",
+        resolved: "#0D1117",
+        light: {
+            raw: "var(--graphite-50)",
+            resolved: "#F8FAFC",
+        },
+        usedByComponentBundle: false,
+    },
+    "fg-muted": {
+        raw: "var(--graphite-400)",
+        resolved: "#94A3B8",
+        light: {
+            raw: "var(--graphite-600)",
+            resolved: "#46536A",
+        },
+        usedByComponentBundle: true,
+    },
+    "fg-primary": {
+        raw: "var(--graphite-50)",
+        resolved: "#F8FAFC",
+        light: {
+            raw: "var(--graphite-950)",
+            resolved: "#0D1117",
+        },
+        usedByComponentBundle: true,
+    },
+    "fg-secondary": {
+        raw: "var(--graphite-300)",
+        resolved: "#CBD5E1",
+        light: {
+            raw: "var(--graphite-800)",
+            resolved: "#222A36",
+        },
+        usedByComponentBundle: true,
+    },
+    "fg-subtle": {
+        raw: "var(--graphite-500)",
+        resolved: "#64748B",
+        light: {
+            raw: "var(--graphite-500)",
+            resolved: "#64748B",
+        },
+        usedByComponentBundle: true,
+    },
+    "glow-blue": {
+        raw: "rgba(59,130,246,0.30)",
+        resolved: "rgba(59,130,246,0.30)",
+        usedByComponentBundle: false,
+    },
+    "glow-cyan": {
+        raw: "rgba(34,211,238,0.40)",
+        resolved: "rgba(34,211,238,0.40)",
+        usedByComponentBundle: false,
+    },
+    "glow-violet": {
+        raw: "rgba(124,58,237,0.45)",
+        resolved: "rgba(124,58,237,0.45)",
+        usedByComponentBundle: true,
+    },
+    "glow-violet-strong": {
+        raw: "rgba(139,92,246,0.65)",
+        resolved: "rgba(139,92,246,0.65)",
+        usedByComponentBundle: true,
+    },
+    "glow-white": {
+        raw: "rgba(248,250,252,0.12)",
+        resolved: "rgba(248,250,252,0.12)",
+        usedByComponentBundle: true,
+    },
+    "gradient-brand": {
+        raw: "linear-gradient(135deg,#7C3AED 0%,#8B5CF6 38%,#22D3EE 100%)",
+        resolved: "linear-gradient(135deg,#7C3AED 0%,#8B5CF6 38%,#22D3EE 100%)",
+        usedByComponentBundle: true,
+    },
+    "gradient-card-selected": {
+        raw: "linear-gradient(180deg,rgba(139,92,246,0.16) 0%,rgba(139,92,246,0.02) 100%)",
+        resolved: "linear-gradient(180deg,rgba(139,92,246,0.16) 0%,rgba(139,92,246,0.02) 100%)",
+        usedByComponentBundle: true,
+    },
+    "gradient-hero-glow": {
+        raw: "radial-gradient(60% 60% at 50% 0%,rgba(124,58,237,0.30) 0%,rgba(34,211,238,0.10) 45%,rgba(7,10,15,0) 80%)",
+        resolved: "radial-gradient(60% 60% at 50% 0%,rgba(124,58,237,0.30) 0%,rgba(34,211,238,0.10) 45%,rgba(7,10,15,0) 80%)",
+        usedByComponentBundle: false,
+    },
+    "gradient-surface": {
+        raw: "linear-gradient(145deg,#1A202B 0%,#0D1117 55%,#070A0F 100%)",
+        resolved: "linear-gradient(145deg,#1A202B 0%,#0D1117 55%,#070A0F 100%)",
+        usedByComponentBundle: true,
+    },
+    "gradient-violet": {
+        raw: "linear-gradient(135deg,#32106D 0%,#6426C7 50%,#A78BFA 100%)",
+        resolved: "linear-gradient(135deg,#32106D 0%,#6426C7 50%,#A78BFA 100%)",
+        usedByComponentBundle: false,
+    },
+    "graphite-0": {
+        raw: "#FFFFFF",
+        resolved: "#FFFFFF",
+        usedByComponentBundle: false,
+    },
+    "graphite-100": {
+        raw: "#F1F5F9",
+        resolved: "#F1F5F9",
+        usedByComponentBundle: false,
+    },
+    "graphite-1000": {
+        raw: "#070A0F",
+        resolved: "#070A0F",
+        usedByComponentBundle: true,
+    },
+    "graphite-200": {
+        raw: "#E2E8F0",
+        resolved: "#E2E8F0",
+        usedByComponentBundle: false,
+    },
+    "graphite-300": {
+        raw: "#CBD5E1",
+        resolved: "#CBD5E1",
+        usedByComponentBundle: false,
+    },
+    "graphite-400": {
+        raw: "#94A3B8",
+        resolved: "#94A3B8",
+        usedByComponentBundle: false,
+    },
+    "graphite-50": {
+        raw: "#F8FAFC",
+        resolved: "#F8FAFC",
+        usedByComponentBundle: true,
+    },
+    "graphite-500": {
+        raw: "#64748B",
+        resolved: "#64748B",
+        usedByComponentBundle: false,
+    },
+    "graphite-600": {
+        raw: "#46536A",
+        resolved: "#46536A",
+        usedByComponentBundle: false,
+    },
+    "graphite-700": {
+        raw: "#2B3442",
+        resolved: "#2B3442",
+        usedByComponentBundle: true,
+    },
+    "graphite-800": {
+        raw: "#222A36",
+        resolved: "#222A36",
+        usedByComponentBundle: false,
+    },
+    "graphite-850": {
+        raw: "#1A202B",
+        resolved: "#1A202B",
+        usedByComponentBundle: false,
+    },
+    "graphite-900": {
+        raw: "#121722",
+        resolved: "#121722",
+        usedByComponentBundle: false,
+    },
+    "graphite-950": {
+        raw: "#0D1117",
+        resolved: "#0D1117",
+        usedByComponentBundle: false,
+    },
+    "green-400": {
+        raw: "#4ADE94",
+        resolved: "#4ADE94",
+        usedByComponentBundle: true,
+    },
+    "green-500": {
+        raw: "#2FBF71",
+        resolved: "#2FBF71",
+        usedByComponentBundle: false,
+    },
+    "green-600": {
+        raw: "#1F9C58",
+        resolved: "#1F9C58",
+        usedByComponentBundle: true,
+    },
+    "red-400": {
+        raw: "#FF7285",
+        resolved: "#FF7285",
+        usedByComponentBundle: true,
+    },
+    "red-500": {
+        raw: "#F0475B",
+        resolved: "#F0475B",
+        usedByComponentBundle: false,
+    },
+    "red-600": {
+        raw: "#C8283C",
+        resolved: "#C8283C",
+        usedByComponentBundle: true,
+    },
+    "signal-connected": {
+        raw: "var(--cyan-500)",
+        resolved: "#06B6D4",
+        light: {
+            raw: "var(--cyan-700)",
+            resolved: "#0E7490",
+        },
+        usedByComponentBundle: true,
+    },
+    "signal-live": {
+        raw: "var(--cyan-400)",
+        resolved: "#22D3EE",
+        light: {
+            raw: "var(--cyan-600)",
+            resolved: "#0891B2",
+        },
+        usedByComponentBundle: true,
+    },
+    "signal-processing": {
+        raw: "var(--violet-400)",
+        resolved: "#A78BFA",
+        light: {
+            raw: "var(--violet-600)",
+            resolved: "#7C3AED",
+        },
+        usedByComponentBundle: true,
+    },
+    "status-error": {
+        raw: "var(--red-500)",
+        resolved: "#F0475B",
+        light: {
+            raw: "var(--red-600)",
+            resolved: "#C8283C",
+        },
+        usedByComponentBundle: true,
+    },
+    "status-error-bg": {
+        raw: "rgba(240,71,91,0.12)",
+        resolved: "rgba(240,71,91,0.12)",
+        light: {
+            raw: "rgba(200,40,60,0.10)",
+            resolved: "rgba(200,40,60,0.10)",
+        },
+        usedByComponentBundle: true,
+    },
+    "status-info": {
+        raw: "var(--blue-500)",
+        resolved: "#3B82F6",
+        light: {
+            raw: "var(--blue-600)",
+            resolved: "#2563EB",
+        },
+        usedByComponentBundle: true,
+    },
+    "status-info-bg": {
+        raw: "rgba(59,130,246,0.12)",
+        resolved: "rgba(59,130,246,0.12)",
+        light: {
+            raw: "rgba(37,99,235,0.10)",
+            resolved: "rgba(37,99,235,0.10)",
+        },
+        usedByComponentBundle: true,
+    },
+    "status-offline": {
+        raw: "var(--graphite-500)",
+        resolved: "#64748B",
+        light: {
+            raw: "var(--graphite-500)",
+            resolved: "#64748B",
+        },
+        usedByComponentBundle: true,
+    },
+    "status-offline-bg": {
+        raw: "rgba(100,116,139,0.14)",
+        resolved: "rgba(100,116,139,0.14)",
+        light: {
+            raw: "rgba(100,116,139,0.10)",
+            resolved: "rgba(100,116,139,0.10)",
+        },
+        usedByComponentBundle: false,
+    },
+    "status-success": {
+        raw: "var(--green-500)",
+        resolved: "#2FBF71",
+        light: {
+            raw: "var(--green-600)",
+            resolved: "#1F9C58",
+        },
+        usedByComponentBundle: true,
+    },
+    "status-success-bg": {
+        raw: "rgba(47,191,113,0.12)",
+        resolved: "rgba(47,191,113,0.12)",
+        light: {
+            raw: "rgba(31,156,88,0.10)",
+            resolved: "rgba(31,156,88,0.10)",
+        },
+        usedByComponentBundle: true,
+    },
+    "status-warning": {
+        raw: "var(--amber-500)",
+        resolved: "#F5A623",
+        light: {
+            raw: "var(--amber-600)",
+            resolved: "#CC8412",
+        },
+        usedByComponentBundle: true,
+    },
+    "status-warning-bg": {
+        raw: "rgba(245,166,35,0.12)",
+        resolved: "rgba(245,166,35,0.12)",
+        light: {
+            raw: "rgba(204,132,18,0.10)",
+            resolved: "rgba(204,132,18,0.10)",
+        },
+        usedByComponentBundle: true,
+    },
+    "surface-disabled": {
+        raw: "var(--graphite-850)",
+        resolved: "#1A202B",
+        light: {
+            raw: "var(--graphite-200)",
+            resolved: "#E2E8F0",
+        },
+        usedByComponentBundle: false,
+    },
+    "surface-interactive": {
+        raw: "var(--graphite-800)",
+        resolved: "#222A36",
+        light: {
+            raw: "var(--graphite-200)",
+            resolved: "#E2E8F0",
+        },
+        usedByComponentBundle: true,
+    },
+    "surface-primary": {
+        raw: "var(--graphite-900)",
+        resolved: "#121722",
+        light: {
+            raw: "var(--graphite-0)",
+            resolved: "#FFFFFF",
+        },
+        usedByComponentBundle: true,
+    },
+    "surface-secondary": {
+        raw: "var(--graphite-850)",
+        resolved: "#1A202B",
+        light: {
+            raw: "var(--graphite-100)",
+            resolved: "#F1F5F9",
+        },
+        usedByComponentBundle: true,
+    },
+    "surface-selected": {
+        raw: "rgba(139,92,246,0.14)",
+        resolved: "rgba(139,92,246,0.14)",
+        light: {
+            raw: "rgba(124,58,237,0.08)",
+            resolved: "rgba(124,58,237,0.08)",
+        },
+        usedByComponentBundle: true,
+    },
+    "surface-tertiary": {
+        raw: "var(--graphite-800)",
+        resolved: "#222A36",
+        light: {
+            raw: "var(--graphite-200)",
+            resolved: "#E2E8F0",
+        },
+        usedByComponentBundle: true,
+    },
+    "violet-300": {
+        raw: "#C4B5FD",
+        resolved: "#C4B5FD",
+        usedByComponentBundle: true,
+    },
+    "violet-400": {
+        raw: "#A78BFA",
+        resolved: "#A78BFA",
+        usedByComponentBundle: true,
+    },
+    "violet-500": {
+        raw: "#8B5CF6",
+        resolved: "#8B5CF6",
+        usedByComponentBundle: false,
+    },
+    "violet-600": {
+        raw: "#7C3AED",
+        resolved: "#7C3AED",
+        usedByComponentBundle: true,
+    },
+    "violet-700": {
+        raw: "#6426C7",
+        resolved: "#6426C7",
+        usedByComponentBundle: false,
+    },
+    "violet-800": {
+        raw: "#4C1D95",
+        resolved: "#4C1D95",
+        usedByComponentBundle: false,
+    },
+    "violet-900": {
+        raw: "#32106D",
+        resolved: "#32106D",
+        usedByComponentBundle: false,
+    },
+    "violet-950": {
+        raw: "#210B4B",
+        resolved: "#210B4B",
+        usedByComponentBundle: false,
+    },
+};