项目简介link

Codebase 是 pixelcave 出品的 Bootstrap 5 管理后台模板与 UI 框架，版本 5.10.0。项目提供了大量可复用的页面模板、UI 组件（图表、表格、表单验证等），以及完整的主题切换与深色模式支持，适合快速搭建企业级后台管理系统。

技术栈link

• Bootstrap 5.3.3（核心 CSS 框架）
• jQuery 3.7.1（DOM 操作与插件生态）
• Gulp 5 + Sass（构建与样式预处理）
• Chart.js、DataTables、FullCalendar、CKEditor 5 等常用组件库

项目结构link

codebase-510/Codebase 5.10 by pixelcave/
├── 01 Codebase Source (HTML)/
│   ├── src/                          # HTML 示例页面
│   ├── gulpfile.babel.js             # Gulp 构建配置
│   ├── package.json
│   └── assets/                       # 编译产物目录（CSS/JS 等）
├── 02 Codebase Source (PHP)/          # PHP 版本（结构相同）
└── THEMELOCK 下载说明文件

核心文件说明link

• src/be_pages_auth_all.html — 认证页面合集（登录、注册、找回密码等）
• src/be_layout_default.html — 默认布局模板（侧边栏 + 内容区）
• src/be_comp_charts.html — Chart.js 图表组件演示
• src/be_forms_validation.html — 表单验证与错误提示示例
• src/be_layout_hero_image.html — 全屏 Hero 首屏布局
• gulpfile.babel.js — Gulp 任务配置，管理 CSS 编译与资源构建

快速开始link

cd "01 Codebase Source (HTML)"
npm install
npm run dev

构建完成后启动本地服务器，浏览器打开 src/ 下的任意 .html 文件即可预览。

使用建议link

Codebase 提供了多种布局变体（固定侧栏、可折叠侧栏、玻璃态 Header 等）和深色模式切换，通过给 #page-container 添加 CSS class 即可切换，适合需要多套后台 UI 风格的场景。