# 把标准后台开源：admin-design 覆盖什么、适合谁用

从平台前端提取的后台基线：语义 Token、布局外壳、公共组件、标准页型与组件总览，MIT 许可，复制即可用。

> Runlume 提供平台能力、独立业务应用与专业服务，支持按需组合。功能、额度与交付范围由所选套餐或服务约定确定；业务应用可独立选用，跨应用协作遵循接入配置与授权边界。

原始页面: https://runlume.app/blog/admin-design-open-source

开发者指南 · 标准后台 / 开源 / 前端基线

发布：2026-09-17 · 作者：Runlume 团队

每个后台项目都要重新做一遍同样的工作：登录、布局、表格、树、通知、设置、空状态与错误状态。做完之后，各自的颜色、间距与交互细节又都不一样，维护成本会跟着页面数量一起涨。

我们把这层公共部分收口成一份可复制的基线，并以 MIT 许可开源：**admin-design**，从 Runlume 平台前端提取出来的标准后台设计与实现。

## 覆盖什么

- 主题与语义 Token：颜色只走语义工具类，六套预设配色叠加基础色与主题色，深浅模式自动跟随。
- 三种布局外壳：侧边导航、顶部 + 侧边、顶部导航；侧栏宽度、圆角、页面过渡与顶栏操作顺序都能调。
- 九类组件页：基础控件、表单与选择、数据展示、反馈与浮层、导航与流程、指标与图表、图标、主题与设置、标准页型。组件总览既是文档，也是验收面。
- 标准页型：工作台、列表、详情、设置、通知中心、登录、注册与找回密码。
- 中英双语、键盘可达与无障碍开关，以及与文档站同源的命令面板搜索。

## 三个入口

- 宣传页与项目说明：[adesign.runlume.app](https://adesign.runlume.app)
- 文档站（组件说明与工程约定）：[adoc.runlume.app](https://adoc.runlume.app)
- 在线演示（两个测试账号，权限不同）：[ago.runlume.app](https://ago.runlume.app)
- 源码与问题反馈：[github.com/runlume/admin-design](https://github.com/runlume/admin-design)

## 适合谁、边界在哪

适合要自己做后台、又不想把界面从零写第二遍的团队：复制仓库，改 `package.json` 的名称，换菜单与品牌资源，把示例数据换成自己的接口即可。

它只包含设计与交互层，不含业务接口、认证实现、权限模型与业务规则；示例数据都在内存里，刷新即重置。身份、上传、树拖拽、懒加载这类能力通过 prop 注入，接入真实服务时替换对应回调，不必改组件内部。

## 相关页面

- [平台能力](https://runlume.app/platform)
- [业务应用](https://runlume.app/apps)
- [开发者](https://runlume.app/developers)
- [关于 Runlume](https://runlume.app/about)
