让开发更高效，让工作更愉快
喜欢就点个 Star ⭐ 支持一下，帮助更多开发者发现它。
已支持 PWA、离线使用、零依赖，适合收藏备用。
English version coming soon – PRs welcome! (You can still use the app in English via the toggle inside the UI)
中文 | English
零依赖、纯前端、多工具集合 + PWA + 深色模式 + 多语言切换。直接访问即可使用：https://wxingda.github.io/devtools-hub
如果这个项目对你有帮助，欢迎到 GitHub 点个 ⭐️Star 支持一下，能帮助更多开发者发现它：
👉 https://github.com/wxingda/devtools-hub
|
✅ 完全离线 - 保护数据隐私，无需担心网络泄露 |
🎨 10+ 实用工具 |
| 工具 | 功能描述 | 特色功能 |
|---|---|---|
| 🔐 密码生成器 | 生成安全的随机密码 | 可自定义长度、密码强度显示、一键复制 |
| 🎨 颜色调色板 | 颜色选择和格式转换 | RGB/HEX/HSL转换、渐变色生成 |
| 🔍 正则表达式测试器 | 实时测试和验证正则表达式 | 语法高亮、常用模板、匹配详情 |
| 📝 JSON格式化器 | 美化和压缩JSON数据 | 语法验证、树状结构显示 |
| 🌐 URL编码/解码器 | URL字符串编码解码 | 批量处理、实时预览 |
| 🔢 Base64编码器 | Base64编码解码工具 | 文本/文件支持、拖拽上传 |
| 🧮 哈希计算器 | MD5、SHA1、SHA256计算 | 多种算法、文件哈希 |
| ⏰ 时间戳转换器 | Unix时间戳转换 | 多格式转换、时区支持 |
| 📷 二维码生成器 | 文本/URL转二维码 | 尺寸/纠错级别/下载PNG |
| 🆚 文本差异对比器 | 对比两段文本差异 | LCS算法、统计信息 |
| 📏 CSS 单位转换器 | px/rem/em/vw/vh/%互转 | 视口/根字号换算 |
🌟 无需下载，立即使用！
# 1. 下载项目
git clone https://github.com/wxingda/devtools-hub.git
cd devtools-hub
# 2. 在浏览器中打开
open index.html # macOS
start index.html # Windows
xdg-open index.html # Linux# 使用 Python
python -m http.server 8000
# 使用 Node.js
npx serve .
# 使用 PHP
php -S localhost:8000支持安装到桌面，像原生应用一样使用！
- 访问在线版本
- 点击浏览器地址栏的"安装"按钮
- 确认安装到桌面
小贴士：当浏览器支持安装时，页面顶部会出现“安装横幅”，同时页眉里也会出现“安装到桌面”按钮；若看不到，可以尝试刷新页面或通过浏览器菜单查找“安装应用”。
- 本站采用 Service Worker 管理静态资源缓存。发布新版本时会自动提示“有新版本可用”。
- 点击“立即更新”将自动激活新版并刷新页面；如未出现提示，可手动强制刷新（macOS：⌘+Shift+R）。
- 若遇到缓存问题，可在浏览器 DevTools 的 Application > Service Workers 页面，先 Unregister 再刷新。
- 可自定义长度（4-128位）
- 支持字母、数字、特殊字符组合
- 密码强度实时显示
- 一键复制功能
- RGB、HEX、HSL格式转换
- 色彩预览
- 渐变色生成
- 色彩搭配建议
- 实时匹配结果
- 语法高亮
- 常用正则模板
- 匹配组详情显示
- 美化JSON数据
- 压缩JSON
- 语法验证
- 树状结构显示
- ✅ JSON 树视图（文本/树双模式切换）
- ✅ 离线二维码生成（取消外部依赖，当前为简化占位版本，后续将升级为真实 QR 算法）
- ✅ 使用统计面板（完全本地，不上传）
- ✅ 插件 API 初步命名空间 (
window.DevToolsHub.registerTool) 预留扩展能力
- 现在支持通过 URL 参数或哈希直达某个工具：
- https://wxingda.github.io/devtools-hub/?tool=json-formatter
- https://wxingda.github.io/devtools-hub/#qr-generator
- 支持的 ID：password-generator、color-palette、regex-tester、json-formatter、url-encoder、base64-encoder、hash-calculator、timestamp-converter、qr-generator、text-diff、css-unit-converter
欢迎提交 PR：改进 QR 生成、补充真实 MD5、增加更多可视化工具。
| 技术 | 用途 | 版本 |
|---|---|---|
| 页面结构 | 5 | |
| 样式设计 | 3 | |
| 交互逻辑 | ES6+ | |
| 图标库 | 6.0 | |
| 字体 | Inter |
- 🚀 零依赖 - 纯原生JavaScript实现
- � 轻量级 - 总体积 < 100KB
- ⚡ 快速加载 - 首屏渲染 < 500ms
- 🔄 实时响应 - 输入即时生效
- � 本地存储 - 保存用户偏好
- 🌍 多语言支持 - 一键切换中文/英文
- ⭐ 快速 Star 引导 - 浮动 Star CTA + 分享条
我们欢迎并感谢每一个贡献者！🎉
|
- 🛠️ 添加新工具
- 🎨 优化界面设计
- 📱 改进移动端体验
- 🌍 多语言支持
- 📚 完善文档
- 🧪 编写测试
感谢所有贡献者的努力！❤️
- 🌍 多语言支持 (中/英切换)
- 📱 PWA 离线与安装
- ⌨️ 键盘快捷键
- 🔄 文本差异对比器
- 📷 二维码生成器
- 📐 CSS 单位转换器
- 📊 使用统计
- 🎨 CSS 代码美化器
- 📱 响应式设计测试器
- 🔍 SEO 标签生成器
- 🧩 插件化扩展架构
- AI 助手集成
- 代码片段收藏夹
- 云同步（可选）
有好的想法？告诉我们！
本项目基于 MIT 许可证开源。
- 感谢 Font Awesome 提供图标
- 感谢 Google Fonts 提供字体
为提升维护性与可扩展性，项目已开始将逻辑按职责拆分：
- script.js：核心应用逻辑与跨工具交互（逐步下沉到 tools/* 模块）
- js/header.js：页头浮动 Star CTA、页面就绪标记（body.ready）等交互
- js/pwa.js：Service Worker 注册、PWA 安装横幅、更新提示等逻辑
已完成的工具模块（逐步迁移中）：
- js/tools/password-generator.js（密码生成器）
- js/tools/json-formatter.js（JSON 美化/压缩/校验 + 树视图 + 搜索）
HTML 片段采用 partials/*.html 并由 js/partials.js 在运行时注入，提升可维护性与复用度。
Service Worker 的预缓存列表已加入新拆分的脚本文件，确保离线可用。
后续规划（按工具进一步模块化）：
- js/tools/password.js（密码生成器）
- js/tools/color.js（颜色调色板）
- js/tools/json.js（JSON 格式化与树视图）
- js/tools/regex.js（正则测试器）
- js/tools/qr.js（二维码生成）
- js/tools/diff.js（文本对比）
- js/tools/hash.js、js/tools/url.js、js/tools/base64.js、js/tools/timestamp.js、js/tools/css-units.js
说明：为避免一次性改动过大导致风险，本次先将 index.html 中的内联脚本抽取成独立文件。等功能验证稳定后，再分阶段把 script.js 中的各工具迁移到独立模块，采用命名空间或在 window 上暴露函数，使现有 HTML 事件绑定（如 onclick）不受影响。
- 感谢所有贡献者和使用者的支持