一个纯前端、零依赖的少女风 PWA 工作台,把每天要用的小工具收进同一个粉色界面:每日计划、英语学习、运动打卡、记账、经期记录、小树洞。数据全部存在浏览器本地,不依赖任何后端。
在线体验:https://pink-workbench.pages.dev
仓库地址:https://github.com/vaxicy/PinkWorkbench
| 模块 | 说明 |
|---|---|
| 📅 每日计划 | 待办清单 + 日程安排,支持分类(补品类 / 饮食 / 工作 / 学习 / 生活) |
| 📚 英语学习 | 每日单词 + 每日长句,可分别或统一设置每天推送数量(1–5) |
| 🏃 运动打卡 | 自定义运动项目、今日打卡、一周打卡统计 |
| 💰 记账 | 日常收支记录,支持按天查看 |
| 🌸 经期记录 | 月经周期日历与身体感受记录 |
| 🌳 小树洞 | 私密心情记录,支持文字 + 图片(自动压缩后本地保存) |
| 🌙 深色模式 | 顶部标题栏一键切换日间奶油粉 / 夜间黑粉主题 |
| 📱 移动端适配 | 底部导航 + iPhone 安全区适配,手机上也能舒适使用 |
| 🐱 个人头像 | 点击头像可切换 emoji 或用相机/上传自定义头像 |
所有内容都保存在浏览器 localStorage,不会上传到任何服务器。
直接访问 https://pink-workbench.pages.dev 即可,无需注册登录。
⚠️ iOS 上只有 Safari 才能把网页添加到主屏幕,微信 / Chrome 内打开时请先点「在 Safari 中打开」。
- 打开 Safari,访问 https://pink-workbench.pages.dev。
- 点底部工具栏中间的 分享按钮(⬆️ 方块图标)。
- 在弹出的菜单中向上滑,找到并点 「添加到主屏幕 / Add to Home Screen」。
- 输入想显示在桌面上的名字(默认会同步你在应用里设置的应用名),然后点右上角 添加。
- 回到桌面,就能看到粉色工作台图标;点击打开即可像原生 App 一样使用,没有浏览器地址栏,离线也能照常使用。
- 用 Chrome 或 Edge 打开 https://pink-workbench.pages.dev。
- 点右上角菜单(⋮)→ 「添加到主屏幕 / 安装应用」。
- 按提示确认,桌面即生成图标。
地址栏右侧会出现「安装」图标(或菜单 → 投射/保存/安装),点击即可当作桌面应用使用。
💡 首次安装需要联网;安装完成后,应用内容会被 Service Worker 缓存到本地,之后没有网络也能打开和查看历史数据。
点击顶部标题栏右侧的 ☀️/🌙 按钮,可在「日间奶油粉」和「夜间黑粉」之间切换,刷新后仍保持你的选择。
- 顶部切换到「每日计划」,在输入框添加待办或日程。
- 用分类标签筛选不同类别的内容。
- 勾选左侧圆圈标记完成,完成的条目会置灰划线。
- 切换到「英语学习」,顶部两个标签分别查看 每日单词 和 每日长句。
- 内容按日期固定生成,每天自动换一批。
- 点标签行最右侧的 ⚙️ 设置数量:
- 统一设置:一个数量同时控制单词和长句(默认)。
- 单独设置:单词、长句分别设置不同数量。
- 添加你的运动项目(如「跳绳 1000 个」)。
- 完成当天项目后打卡,下方「运动统计」会展示本周打卡情况。
- 切换到「记账」,记录每天的收入 / 支出。
- 可按天查看历史记录。
- 在日历上标记周期起止,并记录当天的身体感受。
- 用于跟踪周期规律与身体状态。
- 写一句心情或日记,可附一张图片。
- 图片会自动压缩到合适大小后保存在本地,点击可放大查看。
- 这里是只属于你的私密空间。
- 点击左上角圆形头像,弹出菜单:
- 选择内置 emoji 头像;
- 或点相机图标用摄像头拍照 / 从相册上传自定义头像。
- 纯 HTML + CSS + 原生 JavaScript,无框架、无构建步骤。
- 通过 Service Worker 实现 PWA 离线缓存。
- 数据持久化使用浏览器
localStorage。 - 部署在 Cloudflare Pages。
直接用浏览器打开 index.html 即可(部分 PWA 功能需通过本地服务器,如 npx serve)。
仓库根目录即站点根,执行:
wrangler pages deploy . --project-name pink-workbench --branch main或修改 deploy.ps1 后运行:
powershell -ExecutionPolicy Bypass -File .\deploy.ps1修改了被缓存的文件(如
index.html)后,记得在sw.js里把CACHE_NAME版本号 +1,否则线上用户看到的是旧版本。
本应用完全在本地运行,所有计划、账目、日记、图片都只存在你自己的浏览器中,不会发送到任何第三方。清除浏览器数据即等同于删除全部内容。
本项目为个人学习 / 自用工具,界面与交互参考了多个公开作品,仅供交流与个人使用。