pangolin/design/_ds_manifest.json

{"namespace":"VPNDesignSystem_4c9564","components":[],"startingPoints":[],"cards":[{"path":"preview/brand-app-icon.html","group":"Brand","viewport":"700x170","subtitle":"clay 渐变圆角方,多尺寸","name":"App 图标家族"},{"path":"preview/brand-logo.html","group":"Brand","viewport":"700x185","subtitle":"浅色主锁版 / 深色反白锁版","name":"Logo 锁版"},{"path":"preview/color-clay.html","group":"Colors","viewport":"700x150","subtitle":"穿山甲铜棕主色 50–900,500 为品牌主色","name":"Clay 主色阶"},{"path":"preview/color-dark-surfaces.html","group":"Colors","viewport":"700x185","subtitle":"暖 espresso 背景与表面层级","name":"暗色主题表面"},{"path":"preview/color-sand.html","group":"Colors","viewport":"700x150","subtitle":"暖中性 taupe 50–950,950 为暗色画布","name":"Sand 中性色阶"},{"path":"preview/color-semantic.html","group":"Colors","viewport":"700x175","subtitle":"success / warning / danger 及 subtle 变体","name":"语义状态色"},{"path":"preview/comp-badges.html","group":"Components","viewport":"700x150","subtitle":"连接态 / 套餐 / 节点属性胶囊","name":"状态徽章"},{"path":"preview/comp-buttons.html","group":"Components","viewport":"700x150","subtitle":"主/次/幽灵/危险/禁用/图标","name":"按钮"},{"path":"preview/comp-connect.html","group":"Components","viewport":"700x210","subtitle":"断开 / 连接中 / 已连接 三态","name":"核心连接按钮"},{"path":"preview/comp-inputs.html","group":"Components","viewport":"700x175","subtitle":"输入框(focus 光环)与开关","name":"表单控件"},{"path":"preview/comp-plan-card.html","group":"Components","viewport":"700x300","subtitle":"免费版与 PRO 渐变卡","name":"套餐卡"},{"path":"preview/comp-server-row.html","group":"Components","viewport":"700x300","subtitle":"国家码 · 延迟 · 信号 · 选中态","name":"服务器列表行"},{"path":"preview/radii.html","group":"Spacing","viewport":"700x150","subtitle":"偏大圆角 = 亲和友好","name":"圆角"},{"path":"preview/shadows.html","group":"Spacing","viewport":"700x180","subtitle":"暖色调柔和投影 sm–xl","name":"阴影系统"},{"path":"preview/spacing.html","group":"Spacing","viewport":"700x290","subtitle":"4px 基准间距标尺","name":"间距网格"},{"path":"preview/type-body.html","group":"Type","viewport":"700x190","subtitle":"界面与正文,人文几何","name":"正文字体 (Manrope)"},{"path":"preview/type-cjk.html","group":"Type","viewport":"700x185","subtitle":"CJK 专用伴随字体","name":"中文字体 (Noto Sans SC)"},{"path":"preview/type-display.html","group":"Type","viewport":"700x175","subtitle":"标题大字,几何友好","name":"Display 字体 (Sora)"},{"path":"preview/type-mono.html","group":"Type","viewport":"700x190","subtitle":"IP / 速率 / 密钥读数,tabular nums","name":"等宽数据字体 (JetBrains Mono)"},{"path":"preview/type-scale.html","group":"Type","viewport":"700x330","subtitle":"48 → 12 完整字阶","name":"字号梯度"},{"path":"ui_kits/desktop/index.html","group":"UI Kit — Desktop","viewport":"980x640","subtitle":"macOS 窗口 · 连接/节点/统计/设置 · 中英切换","name":"UI Kit · 桌面客户端"},{"path":"ui_kits/mobile/index.html","group":"UI Kit — Mobile","viewport":"390x760","subtitle":"iOS 连接界面 · 节点 · 账户 · 中英切换 · 双主题","name":"UI Kit · 移动 App"},{"path":"ui_kits/tablet/index.html","group":"UI Kit — Tablet","viewport":"1260x900","subtitle":"iPad 分栏布局 · 侧栏导航 · 连接/节点/统计/账户 · 双语双主题","name":"UI Kit · iPad"},{"path":"ui_kits/usercenter/index.html","group":"UI Kit — Web 用户中心","viewport":"1000x720","subtitle":"概览 / 订阅导入 / 兑换 / 邀请返利 · 中英切换","name":"UI Kit · Web 用户中心"},{"path":"ui_kits/usercenter/mobile-preview.html","group":"UI Kit — Web 用户中心","viewport":"390x780","subtitle":"390px 手机布局 · 横滑导航 · 单列卡片","name":"UI Kit · 用户中心 · 移动端"},{"path":"ui_kits/website/index.html","group":"UI Kit — Website","viewport":"1140x720","subtitle":"产品/定价/下载/文档/Blog · 暖大地色 · 中英切换","name":"UI Kit · 官网宣传页"},{"path":"ui_kits/website/mobile-preview.html","group":"UI Kit — Website","viewport":"390x800","subtitle":"390px 手机布局 · 汉堡菜单 · 注册引导","name":"UI Kit · 官网 · 移动端"}],"templates":[],"globalCssPaths":["colors_and_type.css","ui_kits/website/website.css"],"tokens":[{"name":"--clay-50","value":"#FAF3ED","kind":"color","definedIn":"colors_and_type.css"},{"name":"--clay-100","value":"#F2E2D4","kind":"color","definedIn":"colors_and_type.css"},{"name":"--clay-200","value":"#E6C7AC","kind":"color","definedIn":"colors_and_type.css"},{"name":"--clay-300","value":"#D9A982","kind":"color","definedIn":"colors_and_type.css"},{"name":"--clay-400","value":"#CC8B5C","kind":"color","definedIn":"colors_and_type.css"},{"name":"--clay-500","value":"#B96A3D","kind":"color","definedIn":"colors_and_type.css"},{"name":"--clay-600","value":"#9E5630","kind":"color","definedIn":"colors_and_type.css"},{"name":"--clay-700","value":"#7E4426","kind":"color","definedIn":"colors_and_type.css"},{"name":"--clay-800","value":"#5E331D","kind":"color","definedIn":"colors_and_type.css"},{"name":"--clay-900","value":"#3D2213","kind":"color","definedIn":"colors_and_type.css"},{"name":"--sand-50","value":"#FAF8F4","kind":"color","definedIn":"colors_and_type.css"},{"name":"--sand-100","value":"#F2EEE7","kind":"color","definedIn":"colors_and_type.css"},{"name":"--sand-200","value":"#E6DFD3","kind":"color","definedIn":"colors_and_type.css"},{"name":"--sand-300","value":"#D2C8B8","kind":"color","definedIn":"colors_and_type.css"},{"name":"--sand-400","value":"#B0A491","kind":"color","definedIn":"colors_and_type.css"},{"name":"--sand-500","value":"#8C8270","kind":"color","definedIn":"colors_and_type.css"},{"name":"--sand-600","value":"#6B6253","kind":"color","definedIn":"colors_and_type.css"},{"name":"--sand-700","value":"#4E4940","kind":"color","definedIn":"colors_and_type.css"},{"name":"--sand-800","value":"#2E2A24","kind":"color","definedIn":"colors_and_type.css"},{"name":"--sand-900","value":"#1F1C18","kind":"color","definedIn":"colors_and_type.css"},{"name":"--sand-950","value":"#14110E","kind":"color","definedIn":"colors_and_type.css"},{"name":"--green-400","value":"#7FB07A","kind":"color","definedIn":"colors_and_type.css"},{"name":"--green-500","value":"#5B8C5A","kind":"color","definedIn":"colors_and_type.css"},{"name":"--green-600","value":"#467046","kind":"color","definedIn":"colors_and_type.css"},{"name":"--amber-400","value":"#E2B05A","kind":"color","definedIn":"colors_and_type.css"},{"name":"--amber-500","value":"#D69A3C","kind":"color","definedIn":"colors_and_type.css"},{"name":"--amber-600","value":"#B47E29","kind":"color","definedIn":"colors_and_type.css"},{"name":"--red-400","value":"#D4715A","kind":"color","definedIn":"colors_and_type.css"},{"name":"--red-500","value":"#C0533B","kind":"color","definedIn":"colors_and_type.css"},{"name":"--red-600","value":"#9E4230","kind":"color","definedIn":"colors_and_type.css"},{"name":"--bg","value":"var(--sand-50)","kind":"color","definedIn":"colors_and_type.css"},{"name":"--bg-subtle","value":"var(--sand-100)","kind":"color","definedIn":"colors_and_type.css"},{"name":"--surface","value":"#FFFFFF","kind":"color","definedIn":"colors_and_type.css"},{"name":"--surface-2","value":"var(--sand-50)","kind":"color","definedIn":"colors_and_type.css"},{"name":"--overlay","value":"rgba(31, 28, 24, 0.45)","kind":"color","definedIn":"colors_and_type.css"},{"name":"--fg1","value":"var(--sand-900)","kind":"color","definedIn":"colors_and_type.css"},{"name":"--fg2","value":"var(--sand-600)","kind":"color","definedIn":"colors_and_type.css"},{"name":"--fg3","value":"var(--sand-500)","kind":"color","definedIn":"colors_and_type.css"},{"name":"--fg-on-accent","value":"#FFFFFF","kind":"color","definedIn":"colors_and_type.css"},{"name":"--accent","value":"var(--clay-500)","kind":"color","definedIn":"colors_and_type.css"},{"name":"--accent-hover","value":"var(--clay-600)","kind":"color","definedIn":"colors_and_type.css"},{"name":"--accent-press","value":"var(--clay-700)","kind":"color","definedIn":"colors_and_type.css"},{"name":"--accent-subtle","value":"var(--clay-50)","kind":"color","definedIn":"colors_and_type.css"},{"name":"--accent-border","value":"var(--clay-200)","kind":"color","definedIn":"colors_and_type.css"},{"name":"--border","value":"var(--sand-200)","kind":"color","definedIn":"colors_and_type.css"},{"name":"--border-strong","value":"var(--sand-300)","kind":"color","definedIn":"colors_and_type.css"},{"name":"--ring","value":"rgba(185, 106, 61, 0.35)","kind":"color","definedIn":"colors_and_type.css"},{"name":"--success","value":"var(--green-500)","kind":"color","definedIn":"colors_and_type.css"},{"name":"--success-subtle","value":"#E9F0E6","kind":"color","definedIn":"colors_and_type.css"},{"name":"--warning","value":"var(--amber-500)","kind":"color","definedIn":"colors_and_type.css"},{"name":"--warning-subtle","value":"#F8EED6","kind":"color","definedIn":"colors_and_type.css"},{"name":"--danger","value":"var(--red-500)","kind":"color","definedIn":"colors_and_type.css"},{"name":"--danger-subtle","value":"#F6E1DA","kind":"color","definedIn":"colors_and_type.css"},{"name":"--font-display","value":"'Sora', 'Noto Sans SC', system-ui, sans-serif","kind":"font","definedIn":"colors_and_type.css"},{"name":"--font-sans","value":"'Manrope', 'Noto Sans SC', system-ui, sans-serif","kind":"font","definedIn":"colors_and_type.css"},{"name":"--font-cjk","value":"'Noto Sans SC', 'Manrope', system-ui, sans-serif","kind":"font","definedIn":"colors_and_type.css"},{"name":"--font-mono","value":"'JetBrains Mono', ui-monospace, 'SFMono-Regular', monospace","kind":"font","definedIn":"colors_and_type.css"},{"name":"--text-display-xl","value":"3rem","kind":"font","definedIn":"colors_and_type.css"},{"name":"--text-display","value":"2.25rem","kind":"font","definedIn":"colors_and_type.css"},{"name":"--text-h1","value":"1.875rem","kind":"font","definedIn":"colors_and_type.css"},{"name":"--text-h2","value":"1.5rem","kind":"font","definedIn":"colors_and_type.css"},{"name":"--text-h3","value":"1.25rem","kind":"font","definedIn":"colors_and_type.css"},{"name":"--text-body-lg","value":"1.125rem","kind":"font","definedIn":"colors_and_type.css"},{"name":"--text-body","value":"1rem","kind":"font","definedIn":"colors_and_type.css"},{"name":"--text-sm","value":"0.875rem","kind":"font","definedIn":"colors_and_type.css"},{"name":"--text-caption","value":"0.75rem","kind":"font","definedIn":"colors_and_type.css"},{"name":"--leading-tight","value":"1.15","kind":"font","definedIn":"colors_and_type.css"},{"name":"--leading-snug","value":"1.3","kind":"font","definedIn":"colors_and_type.css"},{"name":"--leading-normal","value":"1.5","kind":"font","definedIn":"colors_and_type.css"},{"name":"--leading-relaxed","value":"1.65","kind":"font","definedIn":"colors_and_type.css"},{"name":"--tracking-tight","value":"-0.02em","kind":"font","definedIn":"colors_and_type.css"},{"name":"--tracking-snug","value":"-0.01em","kind":"font","definedIn":"colors_and_type.css"},{"name":"--tracking-wide","value":"0.04em","kind":"font","definedIn":"colors_and_type.css"},{"name":"--tracking-caps","value":"0.08em","kind":"font","definedIn":"colors_and_type.css"},{"name":"--space-0","value":"0","kind":"spacing","definedIn":"colors_and_type.css"},{"name":"--space-1","value":"0.25rem","kind":"spacing","definedIn":"colors_and_type.css"},{"name":"--space-2","value":"0.5rem","kind":"spacing","definedIn":"colors_and_type.css"},{"name":"--space-3","value":"0.75rem","kind":"spacing","definedIn":"colors_and_type.css"},{"name":"--space-4","value":"1rem","kind":"spacing","definedIn":"colors_and_type.css"},{"name":"--space-5","value":"1.25rem","kind":"spacing","definedIn":"colors_and_type.css"},{"name":"--space-6","value":"1.5rem","kind":"spacing","definedIn":"colors_and_type.css"},{"name":"--space-8","value":"2rem","kind":"spacing","definedIn":"colors_and_type.css"},{"name":"--space-10","value":"2.5rem","kind":"spacing","definedIn":"colors_and_type.css"},{"name":"--space-12","value":"3rem","kind":"spacing","definedIn":"colors_and_type.css"},{"name":"--space-16","value":"4rem","kind":"spacing","definedIn":"colors_and_type.css"},{"name":"--radius-sm","value":"6px","kind":"radius","definedIn":"colors_and_type.css"},{"name":"--radius-md","value":"10px","kind":"radius","definedIn":"colors_and_type.css"},{"name":"--radius-lg","value":"14px","kind":"radius","definedIn":"colors_and_type.css"},{"name":"--radius-xl","value":"20px","kind":"radius","definedIn":"colors_and_type.css"},{"name":"--radius-2xl","value":"28px","kind":"radius","definedIn":"colors_and_type.css"},{"name":"--radius-full","value":"999px","kind":"radius","definedIn":"colors_and_type.css"},{"name":"--shadow-sm","value":"0 1px 2px rgba(45, 30, 20, 0.06)","kind":"shadow","definedIn":"colors_and_type.css"},{"name":"--shadow-md","value":"0 4px 14px rgba(45, 30, 20, 0.08)","kind":"shadow","definedIn":"colors_and_type.css"},{"name":"--shadow-lg","value":"0 12px 32px rgba(45, 30, 20, 0.12)","kind":"shadow","definedIn":"colors_and_type.css"},{"name":"--shadow-xl","value":"0 24px 60px rgba(45, 30, 20, 0.16)","kind":"shadow","definedIn":"colors_and_type.css"},{"name":"--shadow-focus","value":"0 0 0 4px var(--ring)","kind":"shadow","definedIn":"colors_and_type.css"},{"name":"--ease-out","value":"cubic-bezier(0.22, 1, 0.36, 1)","kind":"other","definedIn":"colors_and_type.css","annotation":"other"},{"name":"--ease-in-out","value":"cubic-bezier(0.65, 0, 0.35, 1)","kind":"other","definedIn":"colors_and_type.css","annotation":"other"},{"name":"--dur-fast","value":"140ms","kind":"other","definedIn":"colors_and_type.css","annotation":"other"},{"name":"--dur-base","value":"220ms","kind":"other","definedIn":"colors_and_type.css","annotation":"other"},{"name":"--dur-slow","value":"360ms","kind":"other","definedIn":"colors_and_type.css","annotation":"other"},{"name":"--bg","value":"var(--sand-950)","kind":"color","definedIn":"colors_and_type.css","scope":"[data-theme=\"dark\"]"},{"name":"--bg-subtle","value":"var(--sand-900)","kind":"color","definedIn":"colors_and_type.css","scope":"[data-theme=\"dark\"]"},{"name":"--surface","value":"#221E19","kind":"color","definedIn":"colors_and_type.css","scope":"[data-theme=\"dark\"]"},{"name":"--surface-2","value":"#2A251F","kind":"color","definedIn":"colors_and_type.css","scope":"[data-theme=\"dark\"]"},{"name":"--overlay","value":"rgba(0, 0, 0, 0.6)","kind":"color","definedIn":"colors_and_type.css","scope":"[data-theme=\"dark\"]"},{"name":"--fg1","value":"#F4EFE8","kind":"color","definedIn":"colors_and_type.css","scope":"[data-theme=\"dark\"]"},{"name":"--fg2","value":"#B6AC9C","kind":"color","definedIn":"colors_and_type.css","scope":"[data-theme=\"dark\"]"},{"name":"--fg3","value":"#897F6F","kind":"color","definedIn":"colors_and_type.css","scope":"[data-theme=\"dark\"]"},{"name":"--fg-on-accent","value":"#1F1C18","kind":"color","definedIn":"colors_and_type.css","scope":"[data-theme=\"dark\"]"},{"name":"--accent","value":"var(--clay-400)","kind":"color","definedIn":"colors_and_type.css","scope":"[data-theme=\"dark\"]"},{"name":"--accent-hover","value":"var(--clay-300)","kind":"color","definedIn":"colors_and_type.css","scope":"[data-theme=\"dark\"]"},{"name":"--accent-press","value":"var(--clay-500)","kind":"color","definedIn":"colors_and_type.css","scope":"[data-theme=\"dark\"]"},{"name":"--accent-subtle","value":"rgba(204, 139, 92, 0.14)","kind":"color","definedIn":"colors_and_type.css","scope":"[data-theme=\"dark\"]"},{"name":"--accent-border","value":"rgba(204, 139, 92, 0.30)","kind":"color","definedIn":"colors_and_type.css","scope":"[data-theme=\"dark\"]"},{"name":"--border","value":"rgba(242, 238, 231, 0.10)","kind":"color","definedIn":"colors_and_type.css","scope":"[data-theme=\"dark\"]"},{"name":"--border-strong","value":"rgba(242, 238, 231, 0.18)","kind":"color","definedIn":"colors_and_type.css","scope":"[data-theme=\"dark\"]"},{"name":"--ring","value":"rgba(204, 139, 92, 0.45)","kind":"color","definedIn":"colors_and_type.css","scope":"[data-theme=\"dark\"]"},{"name":"--success","value":"var(--green-400)","kind":"color","definedIn":"colors_and_type.css","scope":"[data-theme=\"dark\"]"},{"name":"--success-subtle","value":"rgba(127, 176, 122, 0.16)","kind":"color","definedIn":"colors_and_type.css","scope":"[data-theme=\"dark\"]"},{"name":"--warning","value":"var(--amber-400)","kind":"color","definedIn":"colors_and_type.css","scope":"[data-theme=\"dark\"]"},{"name":"--warning-subtle","value":"rgba(226, 176, 90, 0.16)","kind":"color","definedIn":"colors_and_type.css","scope":"[data-theme=\"dark\"]"},{"name":"--danger","value":"var(--red-400)","kind":"color","definedIn":"colors_and_type.css","scope":"[data-theme=\"dark\"]"},{"name":"--danger-subtle","value":"rgba(212, 113, 90, 0.16)","kind":"color","definedIn":"colors_and_type.css","scope":"[data-theme=\"dark\"]"},{"name":"--shadow-sm","value":"0 1px 2px rgba(0, 0, 0, 0.4)","kind":"shadow","definedIn":"colors_and_type.css","scope":"[data-theme=\"dark\"]"},{"name":"--shadow-md","value":"0 4px 14px rgba(0, 0, 0, 0.45)","kind":"shadow","definedIn":"colors_and_type.css","scope":"[data-theme=\"dark\"]"},{"name":"--shadow-lg","value":"0 12px 32px rgba(0, 0, 0, 0.5)","kind":"shadow","definedIn":"colors_and_type.css","scope":"[data-theme=\"dark\"]"},{"name":"--shadow-xl","value":"0 24px 60px rgba(0, 0, 0, 0.55)","kind":"shadow","definedIn":"colors_and_type.css","scope":"[data-theme=\"dark\"]"}],"themes":[{"selector":"[data-theme=\"dark\"]","label":"Dark"}],"fonts":[],"brandFonts":[{"family":"Sora","status":"ok","tokens":["--font-display"],"path":"colors_and_type.css"},{"family":"Manrope","status":"ok","tokens":["--font-sans"],"path":"colors_and_type.css"},{"family":"Noto Sans SC","status":"ok","tokens":["--font-cjk"],"path":"colors_and_type.css"},{"family":"JetBrains Mono","status":"ok","tokens":["--font-mono"],"path":"colors_and_type.css"}],"source":"spa"}