@cloudnyx/design-tokens 0.1.0

package/dist/tokens.json

@@ -0,0 +1,388 @@
+{
+  "light": {
+    "color": {
+      "c-accent": "#DE87A6",
+      "c-accent-rgb": "222, 135, 166",
+      "c-purple": "#A892E0",
+      "c-purple-rgb": "168, 146, 224",
+      "c-tech": "#88C2D4",
+      "c-tech-rgb": "136, 194, 212",
+      "c-life": "#F4BC85",
+      "c-life-rgb": "244, 188, 133",
+      "c-bg": "#fdfbfe",
+      "c-bg-rgb": "253, 251, 254",
+      "c-surface": "rgba(255, 255, 255, 0.78)",
+      "c-border": "rgba(255, 255, 255, 0.6)",
+      "c-text-1": "#334155",
+      "c-text-2": "#64748b",
+      "c-divider": "#f1f5f9",
+      "c-success": "#34d399",
+      "c-warning": "#f4bc85",
+      "c-error": "#ef4444",
+      "c-info": "#88c2d4",
+      "paper": "#fdfbfe",
+      "rose-soft": "222, 135, 166",
+      "violet-soft": "168, 146, 224",
+      "sky-soft": "136, 194, 212",
+      "rose-deep": "#c76a92",
+      "rose-deep-rgb": "199, 106, 146",
+      "purple-deep": "#8b6bf0",
+      "purple-deep-rgb": "139, 107, 240",
+      "rose-light": "#f9a8d4",
+      "rose-light-rgb": "249, 168, 212",
+      "violet-light": "#c084fc",
+      "violet-light-rgb": "192, 132, 252",
+      "rose-bright": "#f472b6",
+      "rose-bright-rgb": "244, 114, 182",
+      "sky-light": "#7dd3fc",
+      "sky-light-rgb": "125, 211, 252",
+      "rose-mid": "#f7b2d0",
+      "rose-warm": "#ef93bd",
+      "violet-warm": "#d98ed8",
+      "purple-mid": "#c4a3f0",
+      "pink-pale": "#ffd6e6",
+      "violet-pale": "#e9d5ff",
+      "discover-bg": "#f5f0fa",
+      "rose-deep-light": "#f0b9d0",
+      "online": "#34d399"
+    },
+    "hsl": {
+      "background": "0 0% 100%",
+      "foreground": "222.2 84% 4.9%",
+      "primary": "330 81% 60%",
+      "primary-foreground": "210 40% 98%",
+      "secondary": "210 40% 96.1%",
+      "secondary-foreground": "222.2 47.4% 11.2%",
+      "accent": "330 81% 96%",
+      "accent-foreground": "222.2 47.4% 11.2%",
+      "card": "0 0% 100%",
+      "card-foreground": "222.2 84% 4.9%",
+      "border": "214.3 31.8% 91.4%",
+      "input": "214.3 31.8% 91.4%",
+      "ring": "330 81% 60%",
+      "destructive": "0 84.2% 60.2%",
+      "destructive-foreground": "210 40% 98%",
+      "muted": "210 40% 96.1%",
+      "muted-foreground": "215.4 16.3% 46.9%"
+    },
+    "glass": {
+      "glass-blur-subtle": "blur(8px)",
+      "glass-blur": "blur(16px)",
+      "glass-blur-medium": "blur(20px)",
+      "glass-blur-strong": "blur(24px)",
+      "glass-blur-card": "blur(28px)",
+      "glass-card-saturate": "1.7",
+      "glass-surface": "rgba(255, 255, 255, 0.82)",
+      "glass-surface-hover": "rgba(255, 255, 255, 0.72)",
+      "glass-surface-subtle": "rgba(255, 255, 255, 0.2)",
+      "glass-surface-dark": "rgba(0, 0, 0, 0.05)",
+      "glass-edge-strong": "2px solid rgba(255, 255, 255, 0.5)",
+      "glass-edge-soft": "1px solid rgba(255, 255, 255, 0.25)",
+      "glass-edge-inset": "1px solid rgba(0, 0, 0, 0.06)",
+      "glass-accent-1": "236, 72, 153",
+      "glass-accent-2": "34, 211, 238",
+      "glass-vivid-bg": "var(--glass-surface)",
+      "glass-vivid-saturate": "1.25",
+      "glass-vivid-edge-top": "var(--glass-edge-strong)",
+      "glass-vivid-edge-bottom": "var(--glass-edge-soft)",
+      "glass-vivid-shadow": "var(--shadow-high)"
+    },
+    "clay": {
+      "clay-surface": "rgba(245, 240, 236, 0.6)",
+      "clay-inner": "inset 0 2px 4px rgba(255, 255, 255, 0.6), inset 0 -2px 4px rgba(0, 0, 0, 0.05)",
+      "clay-inner-strong": "inset 0 3px 6px rgba(255, 255, 255, 0.7), inset 0 -3px 6px rgba(0, 0, 0, 0.06)"
+    },
+    "text": {
+      "text-glass": "#1a1a1a",
+      "text-glass-shadow": "0 1px 0 rgba(255, 255, 255, 0.3)",
+      "text-glass-muted": "rgba(26, 26, 26, 0.55)",
+      "ink": "var(--c-text-1, #334155)",
+      "ink-2": "var(--c-text-2, #64748b)"
+    },
+    "shadow": {
+      "shadow-low": "0 4px 12px rgba(0, 0, 0, 0.06)",
+      "shadow-medium": "0 8px 24px rgba(0, 0, 0, 0.08)",
+      "shadow-high": "0 12px 40px rgba(0, 0, 0, 0.2)",
+      "shadow-rest": "0 4px 20px rgba(44, 42, 41, 0.04), 0 1px 3px rgba(44, 42, 41, 0.02)",
+      "shadow-hover": "0 8px 32px rgba(222, 135, 166, 0.12), 0 2px 6px rgba(44, 42, 41, 0.03)",
+      "shadow-float": "0 20px 48px rgba(0, 0, 0, 0.14)",
+      "shadow-image": "0 6px 24px rgba(44, 42, 41, 0.08)",
+      "shadow-soft": "0 2px 8px -2px rgba(0, 0, 0, 0.08), 0 4px 16px -4px rgba(0, 0, 0, 0.06)",
+      "shadow-card-medium": "0 4px 12px -2px rgba(0, 0, 0, 0.12), 0 8px 24px -4px rgba(0, 0, 0, 0.08)",
+      "shadow-glow": "0 0 20px 2px rgba(236, 72, 153, 0.15)"
+    },
+    "spacing": {
+      "sp-1": "1px",
+      "sp-3": "3px",
+      "sp-2xs": "2px",
+      "sp-xs": "4px",
+      "sp-xsh": "5px",
+      "sp-sm-": "6px",
+      "sp-sm": "8px",
+      "sp-smh": "9px",
+      "sp-sm2": "10px",
+      "sp-sm2h": "11px",
+      "sp-md-": "12px",
+      "sp-md": "16px",
+      "sp-mdh": "18px",
+      "sp-lg-": "20px",
+      "sp-lg": "24px",
+      "sp-lgh": "26px",
+      "sp-xl-": "28px",
+      "sp-xl": "32px",
+      "sp-xlh": "36px",
+      "sp-2xl-": "40px",
+      "sp-2xl": "48px",
+      "sp-2xlh": "52px",
+      "sp-3xl-": "56px",
+      "sp-3xl": "64px",
+      "sp-4xl": "80px",
+      "sp-5xl": "96px",
+      "sp-6xl": "120px"
+    },
+    "radius": {
+      "radius-2xs": "2px",
+      "radius-xs": "4px",
+      "radius-sm": "6px",
+      "radius-md": "8px",
+      "radius-lg": "10px",
+      "radius-xl": "12px",
+      "radius-2xl": "14px",
+      "radius-3xl": "16px",
+      "radius-4xl": "18px",
+      "radius-5xl": "20px",
+      "radius-6xl": "22px",
+      "radius-full": "999px"
+    },
+    "motion": {
+      "ease-viscous": "cubic-bezier(0.16, 1, 0.3, 1)",
+      "ease-soft": "cubic-bezier(0.22, 0.61, 0.3, 1)",
+      "ease-spring": "cubic-bezier(0.34, 1.56, 0.64, 1)",
+      "dur-micro": "80ms",
+      "dur-fast": "150ms",
+      "dur-normal": "250ms",
+      "dur-slow": "400ms",
+      "dur-spring": "500ms",
+      "t-fast": "150ms cubic-bezier(0.4, 0, 0.2, 1)",
+      "t-normal": "250ms cubic-bezier(0.4, 0, 0.2, 1)",
+      "t-spring": "400ms cubic-bezier(0.34, 1.56, 0.64, 1)"
+    },
+    "opacity": {
+      "op-disabled": "0.4",
+      "op-muted": "0.55",
+      "op-soft": "0.65",
+      "op-medium": "0.75",
+      "op-strong": "0.85",
+      "op-full": "1"
+    },
+    "zIndex": {
+      "z-base": "1",
+      "z-content": "4",
+      "z-content-high": "20",
+      "z-brand": "30",
+      "z-backdrop": "40",
+      "z-nav": "50",
+      "z-overlay": "60",
+      "z-modal": "70",
+      "z-toast": "80",
+      "z-transition": "200"
+    },
+    "typography": {
+      "font-serif-cn": "\"Noto Serif SC\", serif",
+      "font-display": "\"Instrument Serif\", \"Noto Serif SC\", Georgia, serif",
+      "font-body": "\"Outfit\", \"Noto Sans SC\", system-ui, sans-serif",
+      "fw-regular": "400",
+      "fw-medium": "500",
+      "fw-semibold": "600",
+      "fw-bold": "700",
+      "fw-extrabold": "800"
+    },
+    "focus": {
+      "focus-ring": "0 0 0 2px rgba(var(--c-accent-rgb), 0.3)",
+      "focus-ring-lg": "0 0 0 4px rgba(var(--c-accent-rgb), 0.16)",
+      "focus-ring-glow": "0 0 0 2px rgba(var(--c-accent-rgb), 0.3), 0 0 12px rgba(var(--c-accent-rgb), 0.15)"
+    },
+    "gradient": {
+      "grad-rose": "linear-gradient(135deg, rgba(var(--glass-accent-1), 0.4), rgba(var(--glass-accent-1), 0.1))",
+      "grad-cyan": "linear-gradient(135deg, rgba(var(--glass-accent-2), 0.4), rgba(var(--glass-accent-2), 0.1))",
+      "grad-purple": "linear-gradient(135deg, rgba(var(--purple-deep-rgb), 0.4), rgba(var(--purple-deep-rgb), 0.1))",
+      "j-grad": "linear-gradient(145deg, #ff9dc6 0%, #e191d8 48%, #b488ff 100%)",
+      "j-grad-radial": "radial-gradient(118% 118% at 32% 24%, #ffcde4 0%, #ff9dc6 34%, #b488ff 100%)"
+    },
+    "paper": {
+      "paper-ink": "#2c2620",
+      "paper-ink-strong": "#1f1a14",
+      "paper-ink-muted": "#4a3528",
+      "paper-rose-rgb": "255, 220, 235",
+      "paper-brown-rgb": "80, 50, 30",
+      "void-bg": "#0e0524",
+      "void-bg-rgb": "14, 5, 36",
+      "paper-dark": "#1a1520"
+    },
+    "elysia": {
+      "elysia-ink": "#3b3550",
+      "elysia-ink-2": "#7a7390",
+      "elysia-ink-3": "#a9a2bc",
+      "elysia-dark-surface": "#352a48",
+      "elysia-dark-surface-alt": "#3a2e50",
+      "elysia-dot-border": "#fff5fb",
+      "elysia-dot-border-dark": "#1a1626"
+    },
+    "size": {
+      "radius": "0.75rem",
+      "grid-gap": "var(--sp-md)",
+      "card-radius": "20px",
+      "sp-card-pad": "24px",
+      "sp-gutter": "24px",
+      "radius-card": "var(--radius-3xl)",
+      "radius-inner": "var(--radius-xl)",
+      "blur": "14px"
+    },
+    "component": {
+      "widget-shadow-rgb": "120, 70, 110",
+      "shadow-base-rgb": "44, 42, 41"
+    }
+  },
+  "dark": {
+    "color": {
+      "c-bg": "#0f0f17",
+      "c-bg-rgb": "15, 15, 23",
+      "c-surface": "rgba(157, 117, 255, 0.06)",
+      "c-border": "rgba(255, 255, 255, 0.07)",
+      "c-text-1": "#e2e8f0",
+      "c-text-2": "#94a3b8",
+      "c-divider": "rgba(255, 255, 255, 0.06)",
+      "paper": "#0f0f17",
+      "rose-deep-rgb": "244, 169, 206",
+      "purple-deep-rgb": "184, 155, 232",
+      "rose-bright-rgb": "244, 169, 206",
+      "discover-bg": "var(--void-bg)"
+    },
+    "hsl": {
+      "background": "0 0% 0%",
+      "foreground": "210 40% 98%",
+      "primary": "330 70% 65%",
+      "primary-foreground": "210 40% 98%",
+      "card": "240 6% 11%",
+      "card-foreground": "210 40% 98%",
+      "secondary": "240 5% 18%",
+      "secondary-foreground": "210 40% 98%",
+      "accent": "240 5% 18%",
+      "accent-foreground": "210 40% 98%",
+      "border": "240 4% 22%",
+      "input": "240 5% 18%",
+      "ring": "330 70% 65%",
+      "destructive": "0 62.8% 30.6%",
+      "destructive-foreground": "210 40% 98%",
+      "muted": "240 5% 18%",
+      "muted-foreground": "240 5% 64.9%"
+    },
+    "glass": {
+      "glass-surface": "rgba(255, 255, 255, 0.08)",
+      "glass-surface-hover": "rgba(255, 255, 255, 0.14)",
+      "glass-surface-subtle": "rgba(255, 255, 255, 0.04)",
+      "glass-surface-dark": "rgba(0, 0, 0, 0.2)",
+      "glass-edge-strong": "1px solid rgba(255, 255, 255, 0.12)",
+      "glass-edge-soft": "1px solid rgba(255, 255, 255, 0.06)",
+      "glass-vivid-bg": "linear-gradient(135deg, rgba(46, 38, 78, 0.82) 0%, rgba(20, 17, 34, 0.76) 100%)",
+      "glass-vivid-saturate": "1.15",
+      "glass-vivid-edge-top": "1px solid rgba(255, 255, 255, 0.16)",
+      "glass-vivid-edge-bottom": "1px solid rgba(255, 255, 255, 0.05)",
+      "glass-vivid-shadow": "0 14px 44px rgba(0, 0, 0, 0.5), inset 0 1px 0 rgba(255, 255, 255, 0.07)"
+    },
+    "clay": {
+      "clay-surface": "rgba(35, 35, 42, 0.6)",
+      "clay-inner": "inset 0 2px 4px rgba(255, 255, 255, 0.08), inset 0 -2px 4px rgba(0, 0, 0, 0.15)",
+      "clay-inner-strong": "inset 0 3px 6px rgba(255, 255, 255, 0.1), inset 0 -3px 6px rgba(0, 0, 0, 0.2)"
+    },
+    "text": {
+      "text-glass": "#f0ece4",
+      "text-glass-shadow": "0 1px 0 rgba(0, 0, 0, 0.4)",
+      "text-glass-muted": "rgba(240, 236, 228, 0.55)",
+      "ink": "var(--c-text-1, #e2e8f0)",
+      "ink-2": "var(--c-text-2, #94a3b8)"
+    },
+    "shadow": {
+      "shadow-low": "0 4px 12px rgba(0, 0, 0, 0.2)",
+      "shadow-medium": "0 8px 24px rgba(0, 0, 0, 0.25)",
+      "shadow-high": "0 12px 32px rgba(0, 0, 0, 0.3)",
+      "shadow-float": "0 20px 48px rgba(0, 0, 0, 0.35)",
+      "shadow-rest": "0 4px 20px rgba(0, 0, 0, 0.15), 0 1px 3px rgba(0, 0, 0, 0.08)",
+      "shadow-hover": "0 8px 32px rgba(var(--purple-deep-rgb), 0.15), 0 2px 6px rgba(0, 0, 0, 0.1)",
+      "shadow-image": "0 6px 24px rgba(0, 0, 0, 0.2)",
+      "shadow-soft": "0 2px 8px -2px rgba(0, 0, 0, 0.4), 0 4px 16px -4px rgba(0, 0, 0, 0.3)",
+      "shadow-card-medium": "0 4px 12px -2px rgba(0, 0, 0, 0.5), 0 8px 24px -4px rgba(0, 0, 0, 0.4)",
+      "shadow-glow": "0 0 20px 2px rgba(236, 72, 153, 0.25)"
+    },
+    "paper": {
+      "paper-ink": "#d4cdd8",
+      "paper-ink-strong": "#e8e0ee",
+      "paper-ink-muted": "#a898b8",
+      "void-bg": "#0a0318",
+      "void-bg-rgb": "10, 3, 24",
+      "paper-dark": "#1a1520"
+    },
+    "elysia": {
+      "elysia-ink": "#ece8f6",
+      "elysia-ink-2": "#a6a0c0",
+      "elysia-ink-3": "#6e688a",
+      "elysia-dark-surface": "#352a48",
+      "elysia-dark-surface-alt": "#3a2e50",
+      "elysia-dot-border": "#1a1626",
+      "elysia-dot-border-dark": "#241b36",
+      "rose-deep-light": "#f0b9d0"
+    }
+  },
+  "mobile": {
+    "glass": {
+      "glass-blur-subtle": "blur(4px)",
+      "glass-blur": "blur(8px)",
+      "glass-blur-medium": "blur(10px)",
+      "glass-blur-strong": "blur(12px)",
+      "glass-blur-card": "blur(14px)",
+      "glass-card-saturate": "1.4"
+    }
+  },
+  "themes": {
+    "default": {
+      "name": "极简粉蓝",
+      "glass-accent-1": "236, 72, 153",
+      "glass-accent-2": "34, 211, 238"
+    },
+    "nature": {
+      "name": "自然森系",
+      "glass-accent-1": "16, 185, 129",
+      "glass-accent-2": "34, 197, 94"
+    },
+    "sunset": {
+      "name": "日落暖阳",
+      "glass-accent-1": "251, 146, 60",
+      "glass-accent-2": "251, 113, 133"
+    },
+    "ocean": {
+      "name": "深海静谧",
+      "glass-accent-1": "59, 130, 246",
+      "glass-accent-2": "129, 140, 248"
+    },
+    "lavender": {
+      "name": "薰衣草梦境",
+      "glass-accent-1": "168, 85, 247",
+      "glass-accent-2": "139, 92, 246"
+    },
+    "cyberpunk": {
+      "name": "赛博朋克",
+      "glass-accent-1": "34, 211, 238",
+      "glass-accent-2": "217, 70, 239"
+    },
+    "earthy": {
+      "name": "大地暖调",
+      "glass-accent-1": "245, 158, 11",
+      "glass-accent-2": "249, 115, 22"
+    },
+    "aurora_void": {
+      "name": "极光虚空",
+      "glass-accent-1": "167, 139, 250",
+      "glass-accent-2": "232, 121, 249"
+    }
+  }
+}

package/package.json

@@ -0,0 +1,36 @@
+{
+  "name": "@cloudnyx/design-tokens",
+  "version": "0.1.0",
+  "description": "Crystal Glasshouse design tokens for Cloudnyx Space",
+  "type": "module",
+  "main": "dist/tokens.js",
+  "types": "dist/tokens.d.ts",
+  "exports": {
+    ".": {
+      "import": "./dist/tokens.js",
+      "types": "./dist/tokens.d.ts"
+    },
+    "./css": "./dist/tokens.css",
+    "./json": "./dist/tokens.json",
+    "./tailwind": "./dist/tailwind-preset.js"
+  },
+  "files": [
+    "dist"
+  ],
+  "scripts": {
+    "build": "node build.js",
+    "prepublishOnly": "npm run build"
+  },
+  "keywords": [
+    "design-tokens",
+    "glassmorphism",
+    "crystal",
+    "cloudnyx"
+  ],
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/elysiayunchen/blog-final.git",
+    "directory": "packages/design-tokens"
+  }
+}