夜雨聆风🔥 Pepper：这款开源个人导航面板，让你效率翻倍！
在这个信息爆炸的时代，我们每天都在无数网站、工具和应用中切换。书签栏塞满了链接，重要任务散落在各个角落，提醒事项总是错过……
有没有一个工具，能把这些统统整合在一起？
答案是：有！ 而且完全免费、开源、无需安装！
今天就给大家介绍这款神器 —— Pepper 个人导航面板。
🎯 什么是 Pepper？
Pepper 是一款高端个人导航面板，集网站管理、本地程序启动、任务管理、提醒系统、云端同步于一体。
最惊艳的是：它采用纯前端单文件设计，下载下来就是一个 HTML 文件，双击就能用！无需安装任何依赖，真正开箱即用。
项目地址：https://hujerry618.github.io/Pepper/
开源地址：https://github.com/hujerry618/Pepper
✨ 核心功能一览
1️⃣ 双主题 + 7 种主题色，颜值爆表
- 深色/浅色模式
一键切换（🌙/☀️），保护你的眼睛 
- 7 种主题色
随心切换：蓝/绿/紫/灰/粉/橙/玫红 
每种颜色都有精心调配的渐变效果，界面美到犯规！
2️⃣ 响应式布局，多端适配
自适应桌面/平板/手机 侧边栏鼠标悬停显示/移出隐藏，支持锁定 随时随地高效工作
3️⃣ 双区域设计，工作生活分离
- 左侧 💻 办公区
：企业邮箱、钉钉、腾讯文档、GitHub…… - 右侧 🏠 休闲区
：B站、网易云音乐、微博、下厨房…… 清晰划分工作与生活，进入状态更快
4️⃣ 智能拖拽，自由定制
- 分类拖拽
：支持分类卡片跨区拖拽、重新排序 - 网站拖拽
：详情页内拖拽排序，或拖到其他分类 - 预览线指示
：拖拽时显示蓝色渐变预览线，精确指示插入位置 你的面板，你做主！
5️⃣ 三种类型，全面覆盖
拖拽添加：从桌面拖拽文件/网址到面板自动识别，爽到飞起！
6️⃣ 艾森豪威尔矩阵，任务管理神器
Pepper 内置经典的四象限任务管理系统：
紧急 ↑ ┌─────┼─────┐ ┌─────┼─────┤ │ ⚡ │ 🔥 │ 重要 │ 轻 │ 重 │ ├─────┼─────┤ │ 📝 │ 🎯 │ │ 轻 │ 重 │ └─────┼─────┘ ↓ 不紧急 - 🔥 重要·急
：今日必须完成，红色高亮，最高优先级 - 🎯 重要·缓
：核心任务，蓝色标识，重要但不紧急 - ⚡ 紧急·轻
：高优工作，橙色标识，紧急但不重要 - 📝 轻·缓
：常规工作，灰色标识，日常事务
强大功能：
✅ 任务拖拽：跨象限拖拽调整优先级 ✅ 时间节点：支持多个时间点（如 09:00, 14:00, 17:00） ✅ 截止日期：设置任务截止日期（YYYY-MM-DD） ✅ 完成特效：勾选完成时触发粒子动画效果 ✅ 进度条：每个象限底部显示完成进度（x/y 百分比）
7️⃣ 智能提醒，不再错过
⏰ 定时检查：每 30 秒自动检查即将到期的提醒 🔔 弹窗通知：到时间自动弹窗 + 提示音 💤 稍后提醒：支持 5 分钟后再次提醒 📅 时间排序：提醒按时间自动排序
通知方式：
浏览器通知（Web Notifications API，切换标签页也能收到） 标题闪烁（提醒触发时浏览器 Tab 标题闪烁 🔔） 提示音（双音阶提示音，清晰不刺耳） 持久显示（直到用户主动关闭）
8️⃣ 数据自动归档，工作报告自动生成
- 每日归档
：跨天自动将已完成任务归档到历史记录 - 历史保留
：最近 30 天归档历史 - 报告自动生成
：归档时根据设置自动生成工作报告 
🚀 进阶功能
🔐 安全锁定
0-120 分钟无操作自动锁定（0 表示禁用） 4 位数字密码保护（初始密码：0000） 立即锁定：一键锁定面板 活动检测：鼠标/键盘/触摸操作自动重置计时
🌐 云端同步
账户注册：邮箱 + 密码注册 登录/退出：安全登录，Token 鉴权 手动同步：一键同步面板数据到云端 自动同步：开关控制，暂停/恢复自动同步 后端部署于 Vercel，本地开发时自动切换到 localhost:3000
⌨️ 快捷键，效率翻倍
🌏 中英文切换
完整界面翻译（含设置面板、模态框、报告内容） 即时生效，切换语言无需刷新 分类名称翻译：默认分类支持多语言
💡 使用场景
场景 1：上班族的高效工作台
办公区配置：
💼 企业邮箱、钉钉、腾讯文档 🔧 ProcessOn、TinyPNG 💻 GitHub、Stack Overflow
效果：一键打开所有工作网站，任务四象限管理当日工作，提醒系统确保不错过任何会议。
场景 2：学生的个人学习中心
学习区配置：
📚 B站学习、知乎 🎨 站酷、花瓣网 💻 LeetCode、Coursera
效果：学习网站一键直达，任务系统管理学习任务，提醒系统规划学习时间。
场景 3：自由职业者的全能面板
工作+生活整合：
左侧：客户项目、工作工具 右侧：娱乐、社交、新闻
效果：工作生活清晰分离，任务管理系统规划全天，数据云端同步不丢失。
📥 如何使用？
方法 1：直接访问（最简单）
直接访问：https://hujerry618.github.io/Pepper/
方法 2：本地部署（推荐）
# Pythoncd personal-panelpython -m http.server 8080# Node.jsnpx serve .# 然后访问 http://localhost:8080方法 3：静态托管
上传到任意静态网页托管平台：
GitHub Pages Vercel Netlify 或使用 IIS/Apache/Nginx 部署
🎁 特别功能
1. 访问计数 + 智能排序
自动记录每个网站的打开次数 分类内网站按访问频率排序，常用靠前 长名称自动换行，最多显示 2 行
2. 协议处理器，启动本地程序
支持 mypanel://协议处理器启动本地程序安装 launcher/install.bat即可使用测试：按 Win+R，输入 mypanel://notepad.exe
3. 数据导入导出，安全备份
- 导出备份
：导出所有数据为 JSON 文件 - 导入恢复
：从 JSON 文件导入数据 - 重置默认
：一键恢复初始分类和网站 - 今日工作导出
：导出为易读的 TXT 文本格式（工作日报） - 今日工作导入
：支持 JSON 和 TXT 格式恢复 
🔧 技术栈
- 纯前端
：单 HTML 文件，无需后端（同步功能需配合后端 API） - 原生 JS
：无第三方依赖 - localStorage
：本地数据持久化 - CSS Variables
：主题切换支持 - Drag & Drop API
：原生拖拽支持 - Web Notifications API
：浏览器原生通知 - Web Audio API
：提示音生成 - 自定义协议
： mypanel://协议处理器启动本地程序 - 云端同步
：RESTful API + JWT Token 鉴权（后端部署于 Vercel）
📊 项目信息
- 授权人
：Jerry.h - 开发者
：花椒（Huājiāo） - 版本
：v1.0 - 更新日期
：2026-04-12 - 开源协议
：MIT License
🌟 为什么选择 Pepper？
🚀 立即体验
项目地址：https://hujerry618.github.io/Pepper/
开源地址：https://github.com/hujerry618/Pepper
如果你觉得这个项目对你有帮助，请给它点个 Star ⭐，让更多人发现这个神器！
💬 互动时间
你平时是如何管理工作任务和常用网站的？
你会给 Pepper 添加什么新功能？
欢迎在评论区分享你的想法！
标签：#效率工具 #开源项目 #个人导航 #任务管理 #时间管理 #生产力 #GitHub #纯前端
版权声明：本文为原创内容，未经授权不得转载。Pepper 项目版权归原作者所有。