diff --git a/.github/workflows/deploy-github-pages.yml b/.github/workflows/deploy-github-pages.yml
new file mode 100644
index 0000000..3c0c03a
--- /dev/null
+++ b/.github/workflows/deploy-github-pages.yml
@@ -0,0 +1,59 @@
+name: Deploy GitHub Pages
+
+on:
+  push:
+    branches: [main, master]
+  pull_request:
+    branches: [main, master]
+
+# Sets permissions of the GITHUB_TOKEN to allow deployment to GitHub Pages
+permissions:
+  contents: read
+  pages: write
+  id-token: write
+
+# Allow only one concurrent deployment, skipping runs queued between the run in-progress and latest queued.
+# However, do NOT cancel in-progress runs as we want to allow these production deployments to complete.
+concurrency:
+  group: 'pages'
+  cancel-in-progress: false
+
+jobs:
+  # Build job
+  build:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4
+
+      - name: Setup Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: '18'
+          cache: 'npm'
+
+      - name: Install dependencies
+        run: npm ci
+
+      - name: Build demo
+        run: npm run build:pages
+
+      - name: Setup Pages
+        uses: actions/configure-pages@v4
+
+      - name: Upload artifact
+        uses: actions/upload-pages-artifact@v3
+        with:
+          path: './dist'
+
+  # Deployment job
+  deploy:
+    environment:
+      name: github-pages
+      url: ${{ steps.deployment.outputs.page_url }}
+    runs-on: ubuntu-latest
+    needs: build
+    steps:
+      - name: Deploy to GitHub Pages
+        id: deployment
+        uses: actions/deploy-pages@v4
diff --git a/README-EN.md b/README-EN.md
index 832dbf0..844e4f7 100644
--- a/README-EN.md
+++ b/README-EN.md
@@ -9,6 +9,12 @@
 
 > Modern Vue 3 Gantt chart component library providing complete solutions for project management and task scheduling
 
+## 🌐 Online Demo
+
+🎯 **[Try Live Demo →](https://nelson820125.github.io/jordium-gantt-vue3/)**
+
+*The online demo includes full feature showcase: task management, milestones, theme switching, internationalization, etc.*
+
 ## 🖼️ Demo Show
 
 ![Gantt Chart Overview](design/screenshots/demo.gif)
diff --git a/README.md b/README.md
index b6687fd..d802534 100644
--- a/README.md
+++ b/README.md
@@ -10,7 +10,12 @@
 
 > 现代化的 Vue 3 甘特图组件库，为项目管理和任务调度提供完整解决方案
 
- 
+## 🌐 在线体验
+
+🎯 **[立即体验 Demo →](https://nelson820125.github.io/jordium-gantt-vue3/)**
+
+*在线 Demo 包含完整功能展示：任务管理、里程碑、主题切换、国际化等*
+
 ## 🖼️ Demo展示
 
 ![甘特图概览](design/screenshots/demo.gif)
diff --git a/demo/public/.nojekyll b/demo/public/.nojekyll
new file mode 100644
index 0000000..e69de29
diff --git a/docs/GITHUB-PAGES.md b/docs/GITHUB-PAGES.md
new file mode 100644
index 0000000..3de8fda
--- /dev/null
+++ b/docs/GITHUB-PAGES.md
@@ -0,0 +1,61 @@
+# GitHub Pages 部署指南
+
+本项目已配置 GitHub Pages 自动部署，用户可以在线体验完整的 Gantt 图表功能。
+
+## 🌐 在线访问
+
+**Demo 地址**: https://nelson820125.github.io/jordium-gantt-vue3/
+
+## 🔧 部署配置
+
+### 自动化部署
+
+项目使用 GitHub Actions 自动部署到 GitHub Pages：
+
+- **触发条件**: 推送到 `main` 或 `master` 分支
+- **构建命令**: `npm run build:pages`
+- **部署目录**: `./dist`
+- **工作流文件**: `.github/workflows/deploy-github-pages.yml`
+
+### 手动启用 GitHub Pages
+
+1. 进入 GitHub 仓库设置页面
+2. 找到 "Pages" 设置选项
+3. 选择 "Source" 为 "GitHub Actions"
+4. 推送代码到主分支，自动触发部署
+
+## 📁 构建产物
+
+- **开发构建**: `npm run build` → `dist/`
+- **GitHub Pages**: `npm run build:pages` → `dist/` (包含正确的 base 路径)
+- **NPM 包构建**: `npm run build:lib` → `npm-package/dist/`
+
+## 🛠️ 本地预览
+
+```bash
+# 安装依赖
+npm install
+
+# 启动开发服务器
+npm run dev
+
+# 构建并预览生产版本
+npm run build:pages
+npm run preview
+```
+
+## 🔄 更新部署
+
+每次推送到主分支时，GitHub Actions 会自动：
+
+1. 检出代码
+2. 安装 Node.js 和依赖
+3. 构建 demo 应用
+4. 部署到 GitHub Pages
+
+## 📝 注意事项
+
+- 部署通常需要 1-5 分钟生效
+- 确保 GitHub Pages 在仓库设置中已启用
+- 自定义域名需要在 `demo/public/CNAME` 文件中配置
+- 静态资源路径使用相对路径，确保在 Pages 环境中正常加载
diff --git a/package.json b/package.json
index b7278a0..5f473a8 100644
--- a/package.json
+++ b/package.json
@@ -49,6 +49,7 @@
     "dev:demo": "vite",
     "build": "vue-tsc -b && vite build",
     "build:demo": "vue-tsc -b && vite build",
+    "build:pages": "NODE_ENV=production vue-tsc -b && vite build",
     "build:lib": "vite build --config vite.config.lib.ts",
     "preview": "vite preview",
     "lint": "eslint . --ext .vue,.js,.jsx,.cjs,.mjs,.ts,.tsx,.cts,.mts --fix",
diff --git a/vite.config.ts b/vite.config.ts
index 45592e2..216665f 100644
--- a/vite.config.ts
+++ b/vite.config.ts
@@ -4,6 +4,8 @@ import vue from '@vitejs/plugin-vue'
 // https://vite.dev/config/
 export default defineConfig({
   plugins: [vue()],
+  // GitHub Pages 部署时的 base 路径
+  base: process.env.NODE_ENV === 'production' ? '/jordium-gantt-vue3/' : '/',
   // 开发服务器配置
   root: 'demo',
   // 构建配置