联系我

Open Source Admin UI

轻量级后台管理系统 UI 框架

仿 CoreUI 界面风格，更轻量 — 只提供界面 UI，不绑定业务逻辑，适合快速搭建企业与小项目后台。

进入演示→示例代码
MXBEUI 布局演示界面

Why MXBEUI

没有设计，也能先把后台搭起来

适用于没有视觉设计的项目、对界面布局无从下手的开发者，以及企业站点与小项目后台。

  • 基础布局

    列表、表单、表格、菜单与弹窗（Toast / Alert / Confirm）开箱即用

  • 1100+ 图标

    内置 IconFont 图标字体，语义化 class，替换与扩展都很方便

  • 富文本 & 日期

    集成 WangEditor 与 My97DatePicker，省去重复选型成本

  • Less 源码

    提供 Less 版本，颜色与间距可按项目快速定制

Components

组件与页面示例

按钮、列表、表单、布局、弹窗、图标与登录页 — 点击进入对应演示。

按钮

Btn UI

默认 / 主色 / 成功 / 警告 / 危险及尺寸变体

查看

列表

List UI

筛选、分页、多选与组合列表等常见后台场景

查看

表单

Form UI

输入、选择、上传与校验布局的完整表单示例

查看

布局

Layout UI

两列、三列、Tabs 与文章等多种栅格组合

查看

弹窗

Popup UI

Alert、Confirm、表单弹窗与大图预览

查看

图标

Fonts

IconFont 图标库预览与 class 引用方式

查看

登录

Login

后台登录页模板，可直接套用到项目

查看

Quick Start

两步接入

引入样式，按约定 HTML 结构组合 class 即可。交互需自行封装。

完整示例代码说明文档
<link rel="stylesheet" href="css/mxbeui.css">
<link rel="stylesheet" href="fonts/iconfont.css">

<div class="card">
  <div class="card-header">示例代码</div>
  <div class="card-block">内容</div>
</div>

Ready

打开演示，开始拼装后台界面

只提供 UI，不提供功能 — 把布局交给框架，把业务留给自己。

进入 MXBEUI→