用途:为深色仪表盘、管理后台或控制面板提供一套品牌无关的视觉语言。整体风格为深蓝页面配柔和彩色极光、磨砂玻璃面板与渐变细边框,每个分区通过 tone 色调影响卡片辉光、标签圆点、状态胶囊与图标。
主要能力:交付两个文件。theme.css 是完整设计系统,纯 CSS、不依赖框架,可用于 React、Vue、Svelte、原生 HTML 或与 Tailwind 并存;starter.html 是可运行的参考仪表盘,含外壳、侧边栏、主视觉、KPI 行与内容网格。组件包括 .glass-panel、.cg-shell/.cg-sidebar/.cg-main、.brand-lockup、.nav-pill、.eyebrow、.cg-display、.status-pill、.primary-action/.ghost-action/.icon-button、.search-shell、.kpi-grid、.dashboard-grid 等。
使用方式:将 theme.css 与 starter.html 复制到目标项目,链接样式表 <link rel="stylesheet" href="theme.css"> 或在打包器中 import "./theme.css",再按文档类名组合页面,可从 starter.html 复制区块。换品牌时只改 theme.css 的 :root:--cg-accent-1/2/3 为 RGB 三元组,替换后极光、按钮、边框、品牌球与滚动条同步换肤;也可调整 --cg-bg、--cg-ink、--cg-muted。
适用场景:分析控制台、CRM/销售管线、内容与媒体管线、运维监控、金融科技仪表盘等,通过改文案、导航项与分区 tone 即可复用。
限制:仅适合深色界面,不适合浅色或打印优先 UI、极简编辑风、营销落地页;侧边栏在 1280px 以下折叠,需自备移动导航;每个视图只应有一个 .primary-action。具体收费、价格与平台信息暂未提供。